0

我正在尝试使用 jquery-mobile 列表视图的 autodividersSelector 选项，如jquery-mobile 文档的列表视图部分的“Autodividers”部分中所述。

该列表呈现良好，但没有任何分隔符。分配给 autodividersSelector 的函数永远不会被调用。

这里还有一些其他的复杂性，比如 jsrender 等，所以我将它们原封不动地保留下来，但你会在下面看到它们，我不认为它们是问题的一部分。我错过了什么？

相关代码如下：

<div data-role="page" id="myListPage">

    <div data-role="content">   

        <ul id="myListView" 
            data-role="listview"
            data-autodividers="true"
            >

        </ul>

    </div><!-- /content -->

</div><!-- /page -->


<script type="text/javascript">
$( "#myListPage" ).on("pagebeforecreate", function(event) {
    renderTemplates();
});

function renderTemplates() {
    var data = {
        testItems: [
            {name:1},
            {name:2},
            {name:3},
        ]
    };
    $('#myListView').html(
        $('#myTemplate').render(data)
    );
}

/********** FORMATTING **********/
$("#myListPage").on("pagecreate", function (event) {
    console.log("pagecreate");
    $("#myListView").listview({
        autodividers: true,

        autodividersSelector: function (li) {
            console.log("autodividersSelector");
            var out = "hi"; //var out = $(li).find("h3").text;
            return out;
        }
    });
    $("#myListView").listview("refresh");
});
/********** FORMATTING **********/

</script>
<script id="myTemplate" type="text/x-jsrender">

    {{for testItems}}
        <li><a href="#">
         <h3>Name: {{:name}}</h3>
         <p>Test: {{:name}}</p>
        </a></li>
    {{/for}}

</script>
4

1 回答 1

5

您链接到的文档是实验性的。你正在尝试实现一些尚未完成的东西。请注意 url 如何表示 test。

于 2012-05-25T07:14:28.063 回答