Question

使用HTML创建一个复选框，如下所示：

<form>
   <input type="checkbox" id="category1">Category1<br>
</form>

使用javascript，我们可以选中以下复选框：

$("#category1")[0].checked = true

现在我正在尝试使用jquery-mobile创建相同的页面。复选框如下所示：

<form>
    <label>
        <input name="checkbox-0 " type="checkbox">Check me
    </label>
</form>

为什么这里没有id？名称是id吗？我应该删除属性名称并创建一个名为id？

的名称

如何使用Javascript / jQuery检查此复选框？

我尝试了上面的代码，但它似乎不适用于此复选框。

Answer 1

使用.prop更改“.checkboxradio('refresh')后，您需要刷新它。这是检查jQuery Mobile中复选框/无线电的正确方法。

<强> Demo

$('.selector').prop('checked', true).checkboxradio('refresh');

参考：jQuery Mobile API

Answer 2

你可以这样做：

$('input[name="checkbox-0"]').prop("checked", true).checkboxradio('refresh'); //sets the checkbox
var isChecked =  $('input[name="checkbox-0"]').prop("checked"); //gets the status

Answer 3

直接来自jQ Mobile docs：

$("input[type='checkbox']").attr("checked",true);

Answer 4

使用@Omar 的解决方案，我得到了错误：

<块引用>

未捕获的错误：无法在初始化之前调用 checkboxradio 上的方法；试图调用方法“刷新”

我实际上有一个flipswitch checkbox：

<div class="some-checkbox-area">
    <input type="checkbox" data-role="flipswitch" name="flip-checkbox-lesson-complete"
           data-on-text="Complete" data-off-text="Incomplete" data-wrapper-class="custom-size-flipswitch">
</div>

发现 the solution 是：

$("div.ui-page-active div.some-checkbox-area div.ui-flipswitch input[type=checkbox]").attr("checked", true).flipswitch( "refresh" )

注意事项

我通常不会为页面内容指定 id，因为 jQuery Mobile 将多个 div.ui-page 内容加载到单个 HTML 页面中以提高性能。因此，如果 id 可能在 HTML body 中出现不止一次，我从来没有真正理解如何使用它（也许有人可以澄清这一点）。
如果我使用 prop 而不是 attr，开关会进入无限翻转循环！我没有进一步调查...

如何动态检查“复选框” - jQuery Mobile

4 个答案: