動態添加jQuery的移動組件到列表視圖與格式

當我動態插入下面的代碼，我可以強制頁面刷新，所以它適用於jQuery移動格式。
由於某些原因，它不允許我設置按鈕格式。它真的很奇怪，因爲它允許動態插入列表和按鈕，但我似乎無法格式化名稱以外的按鈕。
它可以通過CSS操作，但我想使用jQuery API。動態添加jQuery的移動組件到列表視圖與格式

$('#cartList').append('<li>' 
    + '<h3>' + game.Title+'</h3>' 
    + '<p>' + '£' + game.Price + '</p>' 
    + '<a href="#cartList" data-role="button" data-icon="none" data-inline="true" onclick="removeItem()">Remove</a>' 
    + '<h3 class="ui-li-aside">' + game.Format + '</h3>' 
    + '</li>').trigger("create");

來源

2012-08-28 user1601634

的jQuery Mobile Doc提到，如果新的列表項目被添加到列表或刪除它，分頻器不會自動更新，你應該在列表視圖調用刷新（）重繪autodividers。

嘗試添加：$('#cartList').listview('refresh');填寫完列表後。

實施例：

<!doctype html> 
<html lang="en"> 
    <head> 
     <title></title> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" /> 
     <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script> 

     <script> 
      $(document).ready(function(){ 
       $("#add-li-button").click(function(){ 
        $('#listList').append("<li data-role=\"collapsible\"> <h3>New List</h3> <div data-role=\"fieldcontain\"></div> </li>").listview("refresh"); 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <div data-role="page" id="page"> 
      <ul id="listList" data-role="listview"> 
      </ul> 
      <input type="button" id="add-li-button" value="add a checkbox to list1" /> 
     </div>  
    </body> 
</html>

來源

2012-08-28 20:43:31

我插入功能使列表中，以便除按鈕正確生成內有這個。它非常奇怪。我找到了一個代碼示例，其中一個按鈕插入列表之外，並且工作正常，將代碼轉移到列表視圖中，並帶來錯誤。繼承人的例子http://jsfiddle.net/hbbvM/ – user1601634

我想通了，放置與自己的div按鈕似乎解決這個:) – user1601634

動態添加jQuery的移動組件到列表視圖與格式

回答

相關問題