在jquery mobile中动态创建的复选框无法正常工作

Question

<div class="ui-checkbox">
      <input type="checkbox" value="1" name="reminder" id="reminder" checked="">
      <label for="reminder" class="ui-btn ui-corner-all ui-btn-inherit ui-btn-icon-left ui-checkbox-off ui-last-child">Reminder</label>
</div>

我通过jquery在运行时生成上面的css和输入复选框但是我的复选框不能选择有人帮助我。

我已尝试使用jquery mobile和nativedroid

Answer 1

对于jQuery Mobile中的动态复选框，您需要通过调用输入上的.checkboxradio()或容器上的.enhanceWithin()来初始化窗口小部件，例如：

var chk = '<label><input type="checkbox" name="checkbox-0 ">Check me</label>';    
$("#dynCheck").empty().append(chk).enhanceWithin();

这假设您有一个id =＆＃34; dynCheck＆＃34;的容器，并且您想在添加动态内容之前将其清空。

<div id="dynCheck"></div>

  

这是 DEMO

Answer 2

您是如何产生上述内容的？我认为这比内容本身更有意义。在通过jQuery创建和检查复选框时，您应该使用prop()方法来实际检查创建的框。

例如：

$('#reminder').prop('checked', true);

Answer 3

您的HTML标记只需要定义一个包含在标签中的复选框（或使用“for”属性的标签）。 jQueryMobile将完成剩下的工作，包括检查/取消选中。您不需要定义任何类，例如ui-radio，ui-btn等。

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

文档： http://demos.jquerymobile.com/1.4.2/checkboxradio-checkbox/

实施例： http://jsfiddle.net/3awV7/