使用JQuery mobile創建ListView不能正常工作

Question

使用JQuery移動設備，我想將ul-ListView添加到通過JScript動態創建它的窗口中，這是一個問題。

當我將固定的ListView添加到HTML時，一切正常。 定義看起來像

    ...            
        <div data-role=content>
             <ul id='listviewAktuelleChecklist' data-role=listview data-theme="d" data-divider-theme="d" data-inset=true>
                <li id="listDividerAktuelleChecklist" data-role=list-divider>yyy Checklist</li>
                <li id='LoadChecklist'> <a> Checkliste von Market-Value laden </a></li>
            </ul>
        </div>
   ...

並在Firefox中顯示其預期的效果。 但是當我用JScript創建它時，它看起來像這樣：

（對不起，由於缺少參考文獻，我不允許在此處添加圖片，因此，這里是圖片的鏈接： http : //www.market-value.de/downloads/ul.jpg

頂部的ListView是我通過HTML定義獲得的，在“確定”按鈕下方生成了什么（對於那些不查看圖片的用戶：生成的Listviw就像普通的HTML“ ul”一樣顯示有項目符號...）

我使用了該代碼：

$("#BTN1").bind  ("click", function (event)
{
 var html = "";
 html += "<ul id='ChecklistListea' data-role=listview data-theme='d' data-divider-theme='d' data-inset=true>"
 html += '<li id="listDividerAktuelleChecklista" data-role=list-divider>yyy Checklist</li>'
 html +=   "<li id='LoadChecklista'> <a> Checkliste laden </a></li>";
 html += "</ul>";
 $(html).appendTo('#DivChecklistListe');

    $("#ChecklistListe").listview("refresh");

});

我嘗試了幾種不同的方法來創建動態HMTL，但結果始終相同。

誰知道，這是怎么回事？

ps：如果我直接在HMTL中定義ListView，而僅添加ListItems，一切正常！

Answer 1

首先，您在錯誤的ID上調用了刷新，但是即使ID正確，這也不起作用。 這是因為要從頭開始創建帶有內部li元素的ul元素的列表視圖。

在這種情況下，僅調用listview（'refresh'）是不夠的，因為必須先初始化listview，然后才能刷新它。

可以這樣完成：

$("#ChecklistListea").listview().listview("refresh");

第一個.listview()調用將初始化一個列表視圖，第二個將為其設置樣式。

工作示例： http : //jsfiddle.net/Gajotres/4HRNK/