Question

我正在创建一个具有listview的JQuery Mobile应用程序。我正在使用Web服务的结果填充listview。因此，列表视图中的项目正在填充，如下所示：

$.each(results, function (i, result) {
  var s = "<li><h2 style='padding-left:40px;'>" + result.title + "</h2><p style='padding-left:40px;'>";
  s += result.subTitle;
  s += "</p><span class='ul-li-count'>" + result.count + "</span></li>";

  $("#resultListView").append(s);
});
$("#resultListView").listview("refresh");

正在正确填充我的列表视图。显示计数气泡的值。但是，UI不会渲染气泡。有没有办法在列表视图中动态构建带计数气泡的结果集？如果是这样，怎么样？

谢谢！

Answer 1

你的方式应该有效。我唯一能想到的是HTML无效。

无论如何，我创建了一个简单的版本来证明它是可能的。 http://jsfiddle.net/kiliman/HDUqp/

基本上，只需为<li/>构建HTML并附加到列表中，然后调用.listview('refresh')

$('#page1').bind('pageinit', function(e, data) {
    var n = 0;
    $('#addResult').click(function(e) {
        var $list = $('#resultListView');

        n++;
        $('<li/>')
            .append($('<h2>', { text: 'Title ' + n }))
            .append($('<p>', { text: 'SubTitle ' + n }))
            .append($('<span />', { text: n, class: 'ui-li-count'}))
            .appendTo($list);
        $list.listview('refresh');
    });
});

JQuery Mobile - 动态计数气泡

1 个答案: