我正在为移动电话编写一个Web应用程序,我希望所有复选框都是带有“检查”或“交叉”的按钮,以及复选框的文本.我有一个使用jQuery UI的工作解决方案,但它看起来并不优雅.有人可以建议任何改进吗?
这是代码:
$(function () { $("input[type=checkBox]") .button({ icons: { primary: "ui-icon-circle-close"} }) .click(function () { if (this.checked) { $(this).button("option","icons",{ primary: 'ui-icon-circle-check' }) } else { $(this).button("option",{ primary: 'ui-icon-circle-close' }) } }); $("input[type=checkBox]:checked") .button({ icons: { primary: "ui-icon-circle-check"} }) .click(function () { if (this.checked) { $(this).button("option",{ primary: 'ui-icon-circle-close' }) } }); });
解决方法
这个选项应该是jqueryui的一部分.
你可以简化:
$("input:checkBox") .button({ icons: {primary: "ui-icon-circle-close"} }) .click(function () { if (this.checked) { $(this).button("option",{primary: "ui-icon-circle-check"}) } else { $(this).button("option",{primary: "ui-icon-circle-close"}) } }) .filter(":checked").button({icons: {primary: "ui-icon-circle-check"}});