2010-11-19 12 views
1

divの.eachメソッドから作成された要素を折り返したいとします。ここでdivで作成されたjQueryラップ要素

は私のコードです:

<script type="text/javascript"> 

$(document).ready(function(){ 
    $.ajax({ 
     type: "GET", 
     url: "xml/timeline.xml", 
     dataType: "xml", 
     success: parseXML 
    }); 

    function parseXML(xml){ 

     $(xml).find("Year").each(function(){ 
      var year = $(this).attr("year"); 
    $(".timeLineWrapper").append('<h2 class="timeYearHead">' + year + "</h2>"); 
    $(this).find("Event").each(function(){ 
    var event = $(this).text();  
       $(".timeLineWrapper").append('<p>' + event + '</p>'); 
      }); // close find Event 
     }); // close find Year 
    } // close parseXML 
}); // Close docDotReady 

</script> 

基本的な考え方は、さまざまな数があるでしょうそのうち毎年のイベント、年ごとにそのリストの下に見出しを作成することです。私はXMLファイルから解析された後、divにイベントをラップしたい。それ、どうやったら出来るの?ここで

<script type="text/javascript"> 

    $(document).ready(function(){ 
     $.ajax({ 
      type: "GET", 
      url: "xml/timeline.xml", 
      dataType: "xml", 
      success: parseXML 
     }); 

     function parseXML(xml){ 

      $(xml).find("Year").each(function(){ 
       var year = $(this).attr("year");    
       $(".timeLine").append('&lt;li class="timeYear"&gt;&lt;h2 class="timeYearHead"&gt;' + year + "&lt;/h2&gt;&lt;/li&gt;"); 
       $(this).find("Event").each(function(){ 
        var event = $(this).text();    
        $(".timeLine").append('&lt;li class="timeEvent"&gt;' + event + '&lt;/li&gt;'); 
       }); // close find Event 
      }); // close find Year 
     } // close parseXML 
    }); // Close docDotReady 

    </script> 

は、それが生成するHTML出力です:

+1

私は恐らく何かが分かりませんが、このajaxの結果である 'html'のスニペットを投稿できますか? –

答えて

0

はここに私の現在のスクリプトです

<?xml version="1.0"?> 
<Years> 
    <Year year="1950"> 
     <Events> 
      <Event> 
       One 
      </Event> 
      <Event> 
       Two 
      </Event> 
      <Event> 
       Three 
      </Event> 
      <Event> 
       Four 
      </Event> 
     </Events> 
    </Year> 
    <Year year="1951"> 
     <Events> 
      <Event> 
       Five 
      </Event> 
      <Event> 
       Six 
      </Event> 
      <Event> 
       Seven 
      </Event> 
     </Events> 
    </Year> 
    <Year year="1952"> 
     <Events> 
      <Event> 
       Eight 
      </Event> 
      <Event> 
       Nine 
      </Event> 
      <Event> 
       Ten 
      </Event> 
      <Event> 
       Eleven 
      </Event> 
      <Event> 
       Twelve 
      </Event> 
     </Events> 
    </Year> 
</Years> 

私の目標:基本的に

<ul class="timeLine"> 
    <li class="timeYear"> 
     <h2 class="timeYearHead">1950</h2> 
    </li> 
    <li class="timeEvent"> 
     One 
    </li> 
    <li class="timeEvent"> 
     Two 
    </li> 
    <li class="timeEvent"> 
     Three 
    </li> 
    <li class="timeEvent"> 
     Four 
    </li> 
    <li class="timeYear"> 
     <h2 class="timeYearHead">1951</h2> 
    </li> 
    <li class="timeEvent"> 
     Five 
    </li> 
    <li class="timeEvent"> 
     Six 
    </li> 
    <li class="timeEvent"> 
     Seven 
    </li> 
    <li class="timeYear"> 
     <h2 class="timeYearHead">1952</h2> 
    </li> 
    <li class="timeEvent"> 
     Eight 
    </li> 
    <li class="timeEvent"> 
     Nine 
    </li> 
    <li class="timeEvent"> 
     Ten 
    </li> 
    <li class="timeEvent"> 
     Eleven 
    </li> 
    <li class="timeEvent"> 
     Twelve 
    </li> 
</ul> 

、私は、このXMLファイルを解析しようとしています各年のXMLファイルにwith aを作成し、それに対応するイベントのリストごとにサブリストを作成することですその年と各リストの各イベントごとにa。

+0

質問に関する情報であれば、「回答」ではなく「質問」セクションに移動する必要があります。 – cmcginty

関連する問題