2

画像とチェックボックスで動的リストを作成したいのですが、正常に動作していますが、関数のオンロードで動的に生成すると、正しく生成されません

私のコードはjsFiddleの例の下にあります

例では HTML 5 に 2 つの li がありますが、JavaScript で生成される 3 つ目の li は正しく生成されません

HTML コード:

<body>
    <!-- page -->
    <div id="tryhtml" data-role="page" data-palette="">
        <!-- header -->
        <div data-role="header" data-position="fixed">
            <h1>Application</h1>   
        </div><!-- /header -->
        <div data-role="content">
            <ul data-icon="none" id="FB" data-role="listview" data-inset="true" data-theme="c" data-dividertheme="a">
                <li data-role="list-divider">Overview</li>
                <li>
                        <input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" data-iconpos="right"/>
                        <label for="checkbox-1a"><img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-ash4/261025_100001129460073_937883521_q.jpg" style="margin-right:20PX; float:left" width="35" height="35"/>Cheetos dffaf</label>

                </li>
                <li>

                        <input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom" data-iconpos="right"/>
                        <label for="checkbox-2a"><img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-ash4/261025_100001129460073_937883521_q.jpg" style="margin-right:20PX; float:left" width="35" height="35"/>Cheetos dffaf</label>

                </li>           
            </ul>
        </div>

    </div><!-- /page -->
</body>

js ファイルのオンロード関数:

 var tag = '<li><input type="checkbox" name="checkbox-5a" id="checkbox-5a" data-iconpos="right"/><label for="checkbox-5a"><img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-ash4/261025_100001129460073_937883521_q.jpg" style="margin-right:20PX; float:left" width="35" height="35"/>Roy dffaf</label></li>';
$('#FB').append(tag);   
$('#FB').listview('refresh');
4

1 に答える 1