autquividers的jquery移动列表视图选择器无法正常工作

Question

我正在尝试使用jquery-mobile listview的autodividersSelector选项,如jquery-mobile文档的List views部分的"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>

Answer 1

您链接的文档是实验性的.您正在尝试实现尚未完成的内容.注意网址如何测试.