jQuery的，而PHP顯示隱藏

<div class="commentfull"> 
    <?php $comment=m ysqli_query($connect, "SELECT * FROM comment WHERE product = '$p'"); $user=m ysqli_query($connect, "SELECT * FROM user"); $datauser=m ysqli_fetch_assoc($user); while ($datacomment=m ysqli_fetch_assoc($comment)) { ?> 
    <div class="commentcontent"> 
     <div class="commentfill"> 
      <?php echo $datacomment[ 'comment']; ?> 
     </div> 
     <ul> 
      <li class="commenttime"> 
       <p> 
        <?php echo $datacomment[ 'time']; ?> 
       </p> 
      </li> 
      <li class="commentreply"><span id="triggerreply">Reply</span></li> 
     </ul> 
    </div> 
    <div class="commentformreply"> 
     <form method="POST" id="myform" action="<?php echo $base; ?>/config/addcomment.php"> 
      <input type="hidden" name="p" value="<?php echo $p; ?>" /> 
      <textarea class="commentarea" name="comment" placeholder="Your comment"></textarea><span class="commentclose">cancel</span> 
     </form> 
    </div> 
    <?php } ?>

的jQuery：jQuery的，而PHP顯示隱藏

$("#triggerreply").click(function() { 
    $(".commentformreply").slideDown("medium"); 
}); 
$(".commentclose").click(function() { 
    $(".commentformreply").slideUp("medium"); 
});

CSS：

.commentformreply {display:none; }

所以，當我點擊 '回覆' 的節目每commentformreply，我只是希望他們中的一個出現在我點擊的地方，如何做到這一點？

來源

2015-06-26 Ching Ching

是否#triggerreply出現多次。？ – Riddler

是的，它的每個顯示評論框都是 –

您需要考慮將表註釋的主鍵添加到Div ID。用於識別。僅僅爲此目的，KAD的解決方案就足夠了。 – Riddler

使用closest()選擇父.commentcontent元素，然後用next()，選擇下一個DIV（這是.commentformreply元素）：

注意

正如KAD說，你必須不產生更多那個具有相同ID的元素。相反，添加一個類（這就是他們是什麼！）

$(".triggerreply").click(function(){ 
    $(this).closest('.commentcontent').next().slideDown("medium"); 
}); 
$(".commentclose").click(function(){ 
    $(this).closest('.commentformreply').slideUp("medium"); 
});

實例（工作）

看看下面的例子。它適用於多個div塊。

$(".triggerreply").click(function(){ 
 
    $(this).closest('.commentcontent').next().slideDown("medium"); 
 
}); 
 
$(".commentclose").click(function(){ 
 
    $(this).closest('.commentformreply').slideUp("medium"); 
 
});

.commentformreply { display:none }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="commentfull">  
 
     <div class="commentcontent"> 
 
      <div class="commentfill">Comment</div> 
 
      <ul> 
 
       <li class="commenttime"><p>Time</p></li> 
 
       <li class="commentreply"><span class="triggerreply">Reply</span></li> 
 
      </ul> 
 
     </div> 
 
     <div class="commentformreply"> 
 
      <form method="POST" id="myform" action="../config/addcomment.php"> 
 
       <input type="hidden" name="p" value="value>" /> 
 
       <textarea class="commentarea" name="comment" placeholder="Your comment"></textarea><span class="commentclose">cancel</span>  
 
      </form> 
 
     </div> 
 
    <div class="commentfull">  
 
     <div class="commentcontent"> 
 
      <div class="commentfill">Comment</div> 
 
      <ul> 
 
       <li class="commenttime"><p>Time</p></li> 
 
       <li class="commentreply"><span class="triggerreply">Reply</span></li> 
 
      </ul> 
 
     </div> 
 
     <div class="commentformreply"> 
 
      <form method="POST" id="myform" action="../config/addcomment.php"> 
 
       <input type="hidden" name="p" value="value>" /> 
 
       <textarea class="commentarea" name="comment" placeholder="Your comment"></textarea><span class="commentclose">cancel</span>  
 
      </form> 
 
     </div> 
 
</div>

來源

2015-06-26 06:43:55 kapantzak

，但它只在第一個工作。如何爲他們每個人做？我的CSS：.commentformreply：display：none; –

非常感謝你kapantzak，所以我必須將id換成class。你太棒了！！！ –

你不能當HTML動態加載，因爲triggerreply訪問作爲元素的ID，ID是具有相同ID的其他元素會衝突，因爲要裝載的數據一個循環。

所以最好用作類別然後叫如下：在輸出

$(".triggerreply").click(function(){ 
    $(this).closest('.commentcontent').next().slideDown("medium"); 
}); 
$(".commentclose").click(function(){ 
    $(this).closest('.commentformreply').slideUp("medium"); 
});

來源

2015-06-26 06:47:40 KAD

jQuery的，而PHP顯示隱藏

回答

相關問題