下面的生成

Question

UPDATE 爲JLRiche

HTML結構的PHP foreach循環中jQuery代碼（這裏是整個DIV ID = content_body_right結構）：

<div id="content_body_right"> 
     <p class="user_text">Tim Flanagan</p><p class="date_text">02-06-2013 @ 12:00PM</p> 
       <p class="message_text">Playin Augusta today. What a beautiful course!</p> 
       <div id="activity_image"> 
        <img src="images/activities/1/actimg.jpg" width="435" /> 
       </div> 
       <div id="tips"> 
        <div id="tip_cap_left"> 
         <a href="dashboard.php?captip=tipyourcap" title="Tip Your Cap" ></a> 
        </div> 
        <div id="tip_cap_right"> 
         <p class="tips_right">12 Tips of the Cap</p> 
        </div> 
       </div> 
       <p class="comments_label"> 
        4 Comments&nbsp;&nbsp;&nbsp; 
        <a href="#" class="see_all" style="display:inline-block" title="See All Comments">see all</a> 
        <a href="#" class="collapse" style="display:none" title="Collapse Comments">collapse</a> 
       </p> 
       <div id="comment1"> 
        <div id="comment_user_img"> 
         <img src="images/defaultuserimg.jpg" width="30" height="30" /> 
        </div> 
        <div id="comment_user"> 
         <p class="user_text_comment">Tim Flanagan</p><p class="date_text_comment">02-06-2013 @ 12:00PM</p> 
         <p class="message_text_comment">Nice jealous of you bro.</p> 
        </div> 
       </div> 
       <div class="comment2" style="display:none; clear:both; margin:0px; overflow:auto"> 
        <div id="comment2_sub"> 
         <div id="comment_user_img"> 
          <img src="images/defaultuserimg.jpg" width="30" height="30" /> 
         </div> 
         <div id="comment_user"> 
          <p class="user_text_comment">Tim Flanagan</p><p class="date_text_comment">02-06-2013 @ 12:00PM</p> 
          <p class="message_text_comment">Nice jealous of you bro.</p> 
         </div> 
        </div> 
        <div id="comment2_sub"> 
         <div id="comment_user_img"> 
          <img src="images/defaultuserimg.jpg" width="30" height="30" /> 
         </div> 
         <div id="comment_user"> 
          <p class="user_text_comment">Tim Flanagan</p><p class="date_text_comment">02-06-2013 @ 12:00PM</p> 
          <p class="message_text_comment">Nice jealous of you bro.</p> 
         </div> 
        </div> 
        <div id="comment2_sub">     
         <div id="comment_user_img"> 
          <img src="images/defaultuserimg.jpg" width="30" height="30" /> 
         </div> 
         <div id="comment_user"> 
          <p class="user_text_comment">Tim Flanagan</p><p class="date_text_comment">02-06-2013 @ 12:00PM</p> 
          <p class="message_text_comment">Nice jealous of you bro.</p> 
         </div> 
        </div> 
       </div> 
    </div> 

讓我知道，如果你需要更多的結構，因爲在它上面和下面都有很多。希望這可以幫助。 我真的很感謝你的幫助！

結束時更新

晚上好一切，

我需要動態創建的數據庫結果X量的jQuery腳本的foreach的X量。 X表示數字會有所不同。這是一種論壇類型的東西，你看到原來的帖子並顯示一個回覆，你會點擊查看全部或全部摺疊來查看或摺疊其餘的。我正在使用典型的$ i變量在foreach循環內增加我的html元素，所以我需要爲每個元素輸出jquery點擊函數。

我需要PHP創建的代碼如下：

$jquery .= "$('#see_all$i').click(function() { 
    $('#comment2_$i').slideDown('fast'); 
    $('#collapse$i').css('display', 'inline-block'); 
    $('#see_all$i').css('display', 'none'); 
    return false; 
}); 

$('#collapse$i').click(function() { 
    $('#comment2_$i').slideUp('fast'); 
    $('#collapse$i').css('display', 'none'); 
    $('#see_all$i').css('display', 'inline-block'); 
    return false; 
})"; 

任何幫助將始終將不勝感激！

感謝

Answer 1

HTML：

<div class="seeall" data-elid="1">...</div> 
... 
<div class="collapse" data-elid="1">...</div> 
... 

JS：

var $bdy=$(document.body) 
$bdy.on("click",".seeall",function(e) { 
     var el=$(this).css('display','none').data("elid"); 
     $('#comment2_'+el).slideDown('fast'); 
     $('.collapse[data-elid="'+el+'"]').css('display','inline-block'); 
    }) 
    .on("click",".collapse", function(e) { 
       //same same 
    }); 

Answer 2

生成相同的jQuery代碼的多，稍有不同的副本是不是一個很好的設計，恕我直言。你應該寫jQuery代碼的方式，只需要在你的頁面一次，如：

$('.see_all').click(function(){ 
    var thisItem = $(this); 
    thisItem.parent().find('.comment').slideDown('fast'); 
    thisItem.parent().find('.collapse').css('display','inline-block'); 
    thisItem.css('display','none'); 
    return false; 
}); 

$('.collapse').click(function(){ 
    var thisItem = $(this); 
    thisItem.parent().find('.comment').slideUp('fast'); 
    thisItem.css('display','none'); 
    thisItem.parent().find('.see_all').css('display','inline-block'); 
    return false; 
})"; 

當然，這也將涉及增加collapse，see_all和comment類相關的HTML元素。