jQueryモバイルテーブルを作成するときにxmlが正しくループしない

私はクラスや何かを持っていなかったときにxml解析が行われていましたが、今はjquery mobileを使ってスタイルを設定しようとしています。ロード後にスタイルがjqueryによって適用されるように、この方法でリストを作成する必要があります。しかし、それはリストの最初の結果をロードするだけです。もし私が$（this）.text（）を警告するなら、私は正しい5つの応答を得ます。しかし、次のコードは動作しません。jQueryモバイルテーブルを作成するときにxmlが正しくループしない

$(document).ready(function() { 

          $.ajax({ 
            type: 'GET', 
            url: 'test.xml', 
            dataType: 'xml', 
            success: function(xmlDoc) { 
            var $xml = $(xmlDoc); 
            $xml.find('FirstName').each(function() { 
                   $("#list").html('<li ><a href="acura.html">' + $(this).text() + '</a></li>'); 
                   $("#list").listview('refresh'); 
                   }); 

            } 
            }); 



      });

相続人のhtml：あなたはすべてのループで新しいHTMLを設定しているここで

<body> 
     <div data-role="page"> 

      <div data-role="header"> 
       <h1>Deep Web</h1> 
      </div><!-- /header --> 

      <ul id="list" data-role="listview"></ul><!-- /content --> 

      <div data-role="footer"> 
       <h4>Footer content</h4> 
      </div><!-- /footer --> 

     </div> 
    </body>

出典

2012-05-07 TMB87

$("#list").html('<li ><a href="acura.html">' + $(this).text() + '</a></li>');

、このような

の変化を、

$("#list").append('<li ><a href="acura.html">' + $(this).text() + '</a></li>');

出典

2012-05-07 21:52:41 ocanal

.html(SONETHING)やり方と同じことですing .empty().append(SOMETHING)。そして、これは、DOMに追加するものをバッファリングし、一度に追加することです。これは、コストのかかる手順なのでです。

      $.ajax({ 
           type: 'GET', 
           url: 'test.xml', 
           dataType: 'xml', 
           success: function(xmlDoc) { 
            var $xml = $(xmlDoc), 
             out = [];//create array to buffer output 
            $xml.find('FirstName').each(function() { 

             //add this index to the buffer array 
             out.push('<li ><a href="acura.html">' + $(this).text() + '</a></li>'); 
            }); 

            //select the #list element only once, replace the HTML all at once, then refresh 
            $("#list").html(out.join('')).listview('refresh'); 

           } 
         });

複数のHTML文字列をまとめて格納するために配列を使用する方法を参照してください。また、既存のリストアイテムを上書きするのではなく、新しいリストアイテムを追加する場合は、.html()を.append()に置き換えることができます。

のドキュメント.append()のドキュメント：http://api.jquery.com/append

出典

2012-05-07 21:54:24 Jasper

jQueryモバイルテーブルを作成するときにxmlが正しくループしない

答えて

関連する問題