2011-08-03 15 views
0

jqueryを使用してセレクタの後に要素を挿入しようとしていますが、正しく取得できませんでした。誰が助けることができる場合、私はそれを感謝..やろうとしています何セレクタの後にjquery要素を挿入する

<div id="blog_cal" class="calendar_panel_bottom_noborder calendar_view"> 
    <div id="csrf" class="hidden_div"><div style="display:none"><input type="hidden" value="f5a7b1a73fb84b7f9f3f363b586a9d16" name="csrfmiddlewaretoken"></div></div> 
    <span class="month">August, 2011</span> 


     <span class="day_name">M</span> 

     <span class="day_name">T</span> 

     <span class="day_name">W</span> 

     <span class="day_name">T</span> 

     <span class="day_name">F</span> 

     <span class="day_name">S</span> 

     <span class="day_name">S</span> 




      <span class="date">1</span> 

      <span class="date">2</span> 

      <span class="date">3</span> 

      <span class="date">4</span> 

      <span class="date">5</span> 

      <span class="date">6</span> 

      <span class="date">7</span> 




      <span class="date">8</span> 

      <span class="date">9</span> 

      <span class="date"><a href="#">10</a></span> 

      <span class="date">11</span> 

      <span class="date">12</span> 

      <span class="date">13</span> 

      <span class="date">14</span> 




      <span class="date">15</span> 

      <span class="date">16</span> 

      <span class="date">17</span> 

      <span class="date">18</span> 

      <span class="date">19</span> 

      <span class="date">20</span> 

      <span class="date">21</span> 




      <span class="date">22</span> 

      <span class="date">23</span> 

      <span class="date">24</span> 

      <span class="date">25</span> 

      <span class="date">26</span> 

      <span class="date">27</span> 

      <span class="date">28</span> 




      <span class="date">29</span> 

      <span class="date">30</span> 

      <span class="date">31</span> 

      <span class="date"></span> 

      <span class="date"></span> 

      <span class="date"></span> 

      <span class="date"></span> 






    <a href="/blog/archives/2011/7/" id="blog_cal_next" class="calendar_nav">next</a> <a href="/blog/archives/2011/9/" id="blog_cal_prev" class="calendar_nav">prev</a> 
    <div class="clear"></div> 
</div> 

は、クラス=日付とはクラスがDAY_NAMEあるスパンの後に新しいスパンの権利を挿入し、すべてのスパンは明らかです。 私は次のことを試してみましたが、それはあなたが

filler = $('<span class="date">'+day[0]+'</span>').insertAfter(filler); 

を行うことができます。しかし、リフローの数を最小限に抑え、すべてを一度にHTMLを挿入するために、実際に良いです逆

 $('#'+CalId).find('span[class~="date"]').remove(); 

     var filler = $('#'+CalId).find('span[class~="day_name"]').last(); 

     $.when(AjaxNavigate(this, CalId)) 
     .then(function(data) { 
        $.each(data.days[0], function(index, week){ 
         $.each(week, function(index, day) { 
          // repopulate date fields 
          filler.after('<span class="date">'+day[0]+'</span>'); 
         }); 
        }); 
       }); 
+0

jQueryテンプレートも参照してください(フィラー部分用)。 –

答えて

0

に挿入された:

var html = $.map(data.days[0], function(week){ 
    return $.map(week, function(day) { 
     return '<span class="date">'+day[0]+'</span>'); 
    }).get().join(''); 
}).get().join(''); 

filler.after(html); 
関連する問題