jQuery Mobile - 动态添加复选框列表

时间:2013-10-18 09:01:15

标签: jquery-mobile

我正在尝试动态添加一个复选框列表,但它没有正确显示移动样式。

这里是js代码:

var name = "option";
var id = "id";

$("#frame").html('<fieldset data-role="controlgroup"><legend>Seleziona le categorie da eliminare:</legend></fieldset>');

for (var i = 0; i < 4; i++) {
  $("fieldset").append('<input type="checkbox" name="' + name + '" id="' + id + '"><label for="' + name + '">' + name + '</label>');
}

$("#frame").append('<a href="#" data-role="button" data-inline="true" id="btndelcat">Elimina</a>');

$("#frame").trigger('create');
编辑JSFiddle上的

Code

1 个答案:

答案 0 :(得分:3)

创建复选框时出错。标签的for属性应与复选框的id匹配。

由此:

$("fieldset").append('<input type="checkbox" name="' + name + '" id="' + id + '"><label for="' + name + '">' + name + '</label>');

对此:

$("fieldset").append('<input type="checkbox" name="' + name + '" id="id' + i + '"><label for="id' + i + '">' + name + '</label>');
  

<强> Demo