0

当我动态插入以下代码时，我可以强制页面刷新，以便它应用 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");
4

1 回答 1

1

jQuery Mobile Doc提到，如果将新列表项添加到列表中或从中删除，则分隔符不会自动更新，您应该在列表视图上调用 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>
于 2012-08-28T20:43:31.293 回答