2013-03-22 25 views
5

Kendi hafif bloglama platformumu yazıyorum (PHP'yi & jQuery öğrenmeye çalışıyorum, bu yüzden sadece WordPress'i kullanmak istemiyorum). PHP kullanarak, sayfa başına 5 blog yazısı gösteren bir sayfalama sistemim var. While döngüsünde, "Yorum bırak" yazan bir bağlantıya sahip olmak istiyorum. Bu, tıklandığında, yorum girmek için bir metin kutusuna sahip bir DIV açacaktır. Kullanmakta olduğum geçerli kod sayfadaki TÜM 5 yorum DIV'lerini açar. Bu komisyonun her birine DIV'nin benzersiz bir kimliğini verebilmem gerekir (benim blog yazısının kimliğine dayanarak) ve jquery toggle işlevine koyup bağlantıya tıklandığında sadece bir yorum DIV açılsın. onlar. Bana yardım eden var mı?Dinamik olarak oluşturulmuş div'ler geçişi

İşte sayfadaki TÜM toggled div'leri açmasını sağlayın benim jQuery var:

<script type="text/javascript"> 
    $(document).ready(function() { 
    $(".toggleCommentBox").click(function() { 
     $(".commentBox").toggle() 
    }); 
    });  
</script> 

Ve burada blog yazısı ve bağlantı görüntülenir benim while döngüsünde kod:

<a href = "#" class = "toggleCommentBox">Leave a Comment</a> 

<div class = "commentBox" style = "display:none;"> 
    ...Form stuff in here 
</div> 

I don commentBox div içinde form şeyler ile yardıma ihtiyacım var, sadece sayfa 5 yorum kutuları her biri yapmak için jQuery ile yardıma ihtiyacım var, ve hepsi 5 geçiş açık bir bağlantı yerine, tek tek geçiş yapılabilir Şu andaki gibi, sayfadaki DIV'ler. Birinin bana verebileceği herhangi bir yardım büyük takdir edilecektir.

cevap

2

Kullanım jquery sonraki fonksiyon:

<script type="text/javascript"> 
    $(document).ready(function() { 
    $(".toggleCommentBox").click(function() { 
     $(this).next(".commentBox").toggle() 
    }); 
    });  
</script> 

http://api.jquery.com/next/

+1

Say, bu mükemmel çalışıyor! –

+0

iyi iş. fontawesome gibi açma/kapama simgesi nasıl eklenir? – Perspolis

4

<a href = "#" class = "toggleCommentBox" getId='1' >Leave a Comment</a> 

<div class = "commentBox" style = "display:none;" id="commentBox1"> 
...Form stuff in here 
</div> 

ben t çalışıyorum anlamak Umut bu

<script type="text/javascript"> 
$(document).ready(function() { 
$(".toggleCommentBox").each(function{ 

    var getId = $(this).attr('getId'); 
    $(this).click(function(){ 

     $("#commentBox"+getId).toggle(); 
    }) 
    }) 
});  
gibi bir şey deneyin

+0

Teşekkürler! Baserati'nin cevabını biraz daha basit olduğu için kullanıyorum. Yine de teşekkür ederim :) –

İlgili konular