Jquery Mobile 复选框问题答案

【问题标题】：Jquery Mobile Checkbox issueJquery Mobile 复选框问题
【发布时间】：2013-06-07 22:52:32
【问题描述】：

我正在尝试使用 JQM 更改复选框状态（选中/未选中）。

在 HTML 部分，我有一个复选框、一个清除按钮和一个设置按钮。

在 Java Script 部分，我有代码要清除并使用按钮设置复选框“选中”值

 HTML code piece:
 ----------------
 <label><input type="checkbox" name="checkboxName" id="checkboxID">checkbox</label>
 <a href="#" id="clear" data-role="button" data-inline="true" data-theme="b">Clear</a>
 <a href="#" id="set" data-role="button" data-inline="true" data-theme="b">Set</a>

 JS code piece:
 --------------
 $("#clear").click(function() {
    $('#checkboxID').filter(':checkbox').prop('checked',false);
 });

 $("#set").click(function() {
    $('#checkboxID').filter(':checkbox').prop('checked',true);
 });

查看此示例：http://jsfiddle.net/VXwzp/14/

点击设置或清除按钮会发现它不起作用。

我正在使用 Google Chrome 版本 26.0.1410.64 m

我注意到，如果我从输入中删除标签，它可以正常工作，但没有考虑 JQM 样式。

 <input type="checkbox" name="checkboxName" id="checkboxID">

查看示例：http://jsfiddle.net/QLzBX/1/

您知道如何使用 JQM 使其工作吗？

提前谢谢你

阿尔瓦罗

【问题讨论】：

通过使用以下内容，我能够让它工作：$('#checkboxID').attr("checked",false).checkboxradio("refresh");

标签： jquery jquery-mobile jquery-mobile-checkbox

【解决方案1】：

工作示例：http://jsfiddle.net/Gajotres/VXwzp/15/

$("#clear").click(function() {
    $('#checkboxID').filter(':checkbox').prop('checked',false).checkboxradio("refresh");
});

$("#set").click(function() {
    $('#checkboxID').filter(':checkbox').prop('checked',true).checkboxradio("refresh");
});

使用 jQuery Mobile 时，您必须了解如何更改其小部件标记，查看我的其他答案：jQuery Mobile: Markup Enhancement of dynamically added content

【讨论】：