Jquery Mobile面板動態列表視圖無法正確呈現

Question

我有一個searchresults.php頁面，其中顯示了幾個已找到的用戶。另外，searchresults.php頁面上是面板

<div data-role="panel" id="mypanel" data-display="overlay" data-theme="a"> 
    <div id="loadedprofile"> 
    </div> 
</div><!-- /panel --> 

當我在「用戶的div」下面的jQuery函數的火災之一點擊打開面板：

上選擇一個搜索結果的面板。

jQuery代碼：

$('[id=profile]').on("click", function(e) { 

    e.preventDefault(); 
    var userid = $(this).attr('userid'); 
    //window.location.href = "userdetails.php?userid=" + userid; 

    $("#mypanel").panel("open"); 
    $("#loadedprofile").load("userdetailspanel.php?userid=" + userid); 

    $("#mypanel").trigger("updatelayout"); 

    $('#commandlist').listview('refresh'); 

    $('[data-role=page]').trigger('pagecreate'); 
    $.mobile.activePage.trigger('pagecreate'); 

    $('#commandlist').listview().listview('refresh'); 

}); 

好了，所以面板正確地打開和動態頁面（userdetailspanel.php）被正確地加載（參見圖）。但是，在userdetailspanel.php上也是一個listview。

<ul data-role="listview" data-inset="true" id="commandlist"> 
<li> 
    <a href="#" id="mylink" name="mylink" > 
    <img src='bolt.png' class="ui-li-icon" />Link 
    </a> 
</li> 
</ul> 

此列表視圖顯示不正確。我只看到藍色的超鏈接。

Answer 1

確定這樣的伎倆是在userdetailspanel部分的底部添加刷新。

因此，UL後，添加：

<script type="text/javascript"> 
     $('#commandlist').listview().listview('refresh'); 
</script> 

Answer 2

追加項目動態進面板之後，調用.trigger('pagecreate');

$('[data-role=page]').trigger('pagecreate'); 

或

$.mobile.activePage.trigger('pagecreate'); 

Demo - JQM 1.3。 2及以下

---

對於jQuery Mobile的1.4版，它是不同的

$('.target').trigger('create') 

Demo - JQM 1.4版APLHA