動態將jquery移動組件添加到具有格式的listview

Question

當我動態插入以下代碼時，我可以強制頁面刷新，以便它應用jQuery移動格式。
由於某種原因，它不允許我設置按鈕格式。 它真的很奇怪，因為它允許動態插入列表和按鈕，但是我似乎無法格式化按鈕的名稱。
可以通過CSS進行操作，但我想使用jQuery API 。

$('#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");

Answer 1

jQuery Mobile Doc提到，如果將新列表項添加到列表中或從列表中刪除，則分隔線不會自動更新，您應該在listview上調用refresh（）重新繪制自動分隔線。

嘗試添加： $('#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>

動態將jquery移動組件添加到具有格式的listview

問題描述

1 個解決方案

解決方案1
1 2012-08-28 20:43:31

動態將jquery移動組件添加到具有格式的listview

問題描述

1 個解決方案

解決方案1 1 2012-08-28 20:43:31

解決方案1
1 2012-08-28 20:43:31