2013-03-16 141 views
4

我已經創建了一個包含複選框的列表視圖。在我想要複選框被選中的少數列表項中。該列表視圖是在內容來自服務器時動態創建的。如果html被動態創建,複選框的「checked」屬性不會被啓用

我有以下jsfiddle代碼。 http://jsfiddle.net/praleedsuvarna/rN28z/

你能幫我解決這個問題嗎?在此先感謝

下面

是哪裏「選中」的第二和第三個複選框設置我的動態列表內容的例子

$(document).on('pageshow', '#index', function(){  
    var list = '<li>'+ 
    ' <div class="checkBoxLeft">'+ 
    '  <input type="checkbox" name="checkbox-0" id="checkbox-0" class="hidden-checkbox"/>'+ 
    ' </div> '+ 
    ' <a href="item1.html" class="detailListText">item1</a>'+ 
    '</li>'+ 
    '<li>'+ 
    ' <div class="checkBoxLeft">'+ 
    '  <input type="checkbox" name="checkbox-0" id="checkbox-0" class="hidden-checkbox" checked="checked"/>'+ 
    ' </div>'+ 
    ' <a href="item1.html" class="detailListText">item2</a>'+ 
    '</li>'+ 
    '<li>'+ 
    ' <div class="checkBoxLeft">'+ 
    '  <input type="checkbox" name="checkbox-0" id="checkbox-0" class="hidden-checkbox" checked="checked"/>'+ 
    ' </div>      '+ 
    ' <a href="item1.html" class="detailListText">item3</a>'+ 
    '</li>' 

    $("#viewdata").html(list); 
    $("#viewdata").listview("refresh"); 
}); 
下面

是我的html頁面

<body> 
    <div data-role="page" id="index"> 
     <div data-theme="a" data-role="header"> 
      <h3> 
       First Page 
      </h3> 
      <a href="#second" class="ui-btn-right">Next</a> 
     </div> 

     <div data-role="content"> 
      <ul data-role="listview" data-theme="a" id="viewdata"> 
      </ul> 
     </div> 

     <div data-theme="a" data-role="footer" data-position="fixed"> 

     </div> 
    </div> 
</body> 
+0

[檢查和取消選中JQuery Mobile對話框中的複選框]可能的重複(http://stackoverflow.com/questions/13675364/checking-unchecking-checkboxes-inside-a-jquery-mobile-dialog) – mplungjan 2013-03-16 07:57:16

+0

在該帖子中checked屬性通過jquery設置。我希望它成爲我動態html的一部分。你能幫我一下嗎? – Prals 2013-03-16 08:33:03

回答

3

固定和小清理版本:http://jsfiddle.net/rN28z/6/

我移動此代碼:

$('input[type="checkbox"]').each(function() { 
    $(this).parent('.checkBoxLeft').addClass(this.checked ? 'checked' : 'not-checked'); 
}); 

裏面pageshow處理程序。你在pagebeforeshow上調用它,到那時你的HTML還沒有被填充。

+0

謝謝了一噸...這爲我工作...乾杯 – Prals 2013-03-16 09:12:54

+0

嗨@dfsq,我有同樣的問題。你可以參考[這個SO問題?](http://stackoverflow.com/questions/19447873/checkbox-having-an-issue-with-jquery-event-binding-for-textarea) – NullPointer 2013-10-22 12:50:25

相關問題