2010-10-28 19 views
0

當數據庫中只有一個條目但添加另一個條目並且現在出現問題時,這很有效。由於我是基於類名追加的,因此我將每個元素都附加到一個類中。我不知道該怎麼做才能創建兩個「blogHeadlines」,並在其中分別輸入適當的內容。在通過jquery.each()循環時創建jquery.append()的元素時遇到問題

的jQuery:

 $(blogEntries).each(function() { 
      //Create the blog headline element   
      $('#blogPage').append($('<div class="blogHeadline">')); 

      //Add the toggle button 
      $('.blogHeadline').append('<input class="toggleButton" type="button" value="+" />'); 

      //Append the title and the date to the blogHeadline 
      $('.blogHeadline').append('<span class="blogTitle">' + this.Title + ' | </span>'); 
      //Cast the date to a Date object 
      var BlogDate = new Date(this.Date); 
      $('.blogHeadline').append('<span class="blogDate">' + BlogDate.toDateString() + '</span>'); 

      //Add the blog content element 
      $('#blogPage').append($('<div class="blogContent">')); 
      //Append the blog entry 
      $('.blogContent').append(this.Entry); 

      //Toggle the blog content 
      $('.toggleButton').live("click", function() { 
       $('.blogContent').slideToggle('slow'); 
       $('.toggleButton').val() == "+" ? $('.toggleButton').val('-') : $('.toggleButton').val('+') 
      }); 
     }); 

過程的輸出是荒謬的,它看起來有點像這樣:

第二個測試| Wed Oct 27 2010test blog |週一9月20 2010這是從 第二次博客條目喬格里格

這是一個測試博客

test blog |週一2010年9月20日

這是一個測試博客

它應該更像:

第二個測試|星期三2010年10月27日

這是喬·格里格

測試博客第二博客條目| Mon Sep 20 2010

這是一個測試博客。

感謝您的幫助。 -Joe

回答

1

避免追加剛創建內容:

$(blogEntries).each(function() { 
    //Create the blog headline element 

    var BlogDate = new Date(this.Date); 

    var Headline = $('<div class="blogHeadline" />'); 

    Headline.append('<input class="toggleButton" type="button" value="+" />') 
      .append('<span class="blogTitle">' + this.Title + ' | </span>') 
      .append('<span class="blogDate">' + BlogDate.toDateString() + '</span>') 
      .appendTo('#blogPage'); 

    // now do something similar with your Content: 
    //... 
}); 

和$( '切換按鈕。')生活()並不需要在每次迭代定義。

+0

謝謝1月我迫不及待地嘗試了! – MrGrigg 2010-10-28 12:09:36

+0

這工作完美,再次感謝!這讓我回到敬畏的jQuery。 – MrGrigg 2010-10-28 22:36:12