JQuery Mobile - Dynamic Count Bubbles

Question

私はリストビューを持つJQuery Mobileアプリケーションを作成しています。私はそのリストビューにWebサービスの結果を入力しています。このため、リストビューのアイテムは、次のように表示されます。

$.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'); 
    }); 
});