4

チェックボックスを含むリストビューを作成しました。リスト項目のいくつかで、チェックボックスをオンにしたかったのです。コンテンツがサーバーから取得されると、リストビューが動的に作成されます。

次のjsfiddleコードがあります。http://jsfiddle.net/praleedsuvarna/rN28z/

この問題を解決するのを手伝ってくれませんか? 前もって感謝します

以下は、2番目と3番目のチェックボックスが「チェック済み」に設定されている動的リストコンテンツの例です

$(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>
4

1 に答える 1

3

修正され、少しクリーンアップされたバージョン: http://jsfiddle.net/rN28z/6/

このコードを移動しました：

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

内部pageshowハンドラー。あなたはそれを呼び出していましたがpagebeforeshow、その時までにあなたの HTML はまだ入力されていませんでした.

于 2013-03-16T08:03:40.617 に答える