jQuery Mobile - 動態添加複選框列表

Question

我試圖動態添加複選框列表，但不能正確顯示移動樣式。

這裏的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'); 

Code上編輯的jsfiddle。

Answer 1

創建複選框時出現錯誤。標籤的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