從ajax動態生成列表視圖 - 刷新不工作

Question

我想用jquery mobile動態生成listview。我有這樣的代碼，但.listview（「刷新」）不工作：

<div id="content" data-role="content">  
</div><!-- /content --> 

<script type="text/javascript"> 
    $.ajax({ 
     type: "GET", 
     url: "my.json", 
     dataType: "json", 
     success: function(articles) { 
      var html = '<ul id="hellolist" data-role="listview"><li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li></ul>';    
      $('#content').append($(html)); 
      $('#hellolist').listview('refresh'); 
     }        
    }); 
</script> 

如果我只生成列表中的項目或我不使用AJAX刷新格式列表視圖很好。

測試＃1：效果很好。

<div id="content" data-role="content"> 
    <ul id="hellolist" data-role="listview"> </ul> 
</div><!-- /content --> 

<script type="text/javascript"> 
     var html = '<li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li>';    
     $('#hellolist').append($(html)); 
     $('#hellolist').listview('refresh'); 
</script> 

測試2：效果很好。

<div id="content" data-role="content">  
</div><!-- /content --> 

<script type="text/javascript"> 
     var html = '<ul id="hellolist" data-role="listview"><li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li></ul>';    
     $('#content').append($(html)); 
     $('#hellolist').listview('refresh'); 
</script> 

測試＃3：效果很好。

<div id="content" data-role="content"> 
    <ul id="hellolist" data-role="listview"> </ul>  
</div><!-- /content --> 

<script type="text/javascript"> 
    $.ajax({ 
     type: "GET", 
     url: "my.json", 
     dataType: "json", 
     success: function(articles) { 
      var html = '<li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li>';    
      $('#hellolist').append($(html)); 
      $('#hellolist').listview('refresh'); 
     }        
    }); 
</script> 

有人有什麼想法來解決這個問題嗎？

Answer 1

如果你不想在HTML空UL標籤，你可以嘗試調用.trigger（「創建」）方法，而不是.listview（ 「刷新」）;

如果不行，請嘗試只調用.listview（）;沒有 「刷新」 參數

所以，基本上，而不是

。

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

嘗試

$('#hellolist').trigger('create'); 

或

$('#hellolist').listview(); 

好運。

編輯：如果事情仍然不起作用，您可以嘗試在包含新列表的頁面上觸發創建事件。

Answer 2

它不是第一個工作，因爲你也追加了UL標籤。 嘗試追加'LI'標籤，UL應該已經在html結構中。

var html = '<li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li>'; 

在你的HTML：

<ul data-role="listview" id="" data-split-icon="gear" data-split-theme="a" ></ul>