Question

我被困住了。我需要根据类别设置listview autodivider。试图使用文档中的示例。它仅显示第一个li的类别。请帮忙。

for (var i = 0, item = null; i < dataset.length; i++) {

            item = dataset.item(i);
            allVendors.push('<li category="' + item['usercat'] +'"><a href="" data-view-id="' + item['id'] +'" class="view"><h2>' + item['username'] + '</h2></a></li>');               
        }
            // Remove any previously appended
            $('.todo-listview li').remove();

            // Append built up arrays to ULs here.
            $('.todo-listview').append(allVendors);            

            $('.todo-listview').listview({
                autodividers:true,
                autodividersSelector: function ( li ) {
                var out = $("li").attr("category"); /* generate a string based on the content of li */;
                return out;
                }

                });
            $('.todo-listview').listview("refresh");

Answer 1

首先，如果您的数据集已按类别排序，则自动分割器才有效。假设它是，尝试使用类别的数据属性，就像您的view-id：

<li data-category="' + item['usercat'] +'">

然后在autodividersSelector脚本中，只需检索此数据属性：

$('.todo-listview').listview({
      autodividers:true,
      autodividersSelector: function ( li ) {
        var out = li.data("category");
        return out;
      }
});

在autodividersSelector函数中，li已经是一个表示<li> dom元素的jQuery对象，所以只需使用jQuery .data（）函数来检索类别。

这是一个有效的 DEMO

JQM listview基于类别

1 个答案: