jQuery點擊淡入隱藏元素while循環

我有一個while循環的窗體，當我點擊Reply按鈕時激活。這我可以簡單地做，但它在while循環，並需要一個唯一的ID。我的代碼一直工作到現在，但它只適用於第一個結果。當我點擊其他結果時，沒有任何反應。即使我已經分配了一個唯一的ID，但它不起作用。jQuery點擊淡入隱藏元素while循環

jQuery的一部分：我下面的代碼給出

$(document).ready(function() { 
    $("#reply").on('click', 'a.click', function() { 
     var rowid = $(this).attr("data-rowid"); 
     $(".reply-comment-holder[data-rowid='" + rowid + "']").fadeToggle(800), 
     $(this).toggleClass(".reply-comment-holder[data-rowid='" + rowid + "']"); 
    }); 
});

PHP HTML部分：

<?php while($fetch_cmts = $get_cmtq->fetch()){ extract($fetch_cmts); ?> 
    <div id="reply"><a href="javascript:;" data-rowid="<?php echo $cmt_id?>" class="click show-reply-box">Reply</a></div> 
    <div class="reply-comment-holder" data-rowid="<?php echo $cmt_id?>" style="display:none;"> 
       <form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" class="full-width cmtform" id="cmt_form_id_<?php echo $cmt_id?>"> 
       <input type="hidden" name="status_id" value="<?php echo $cmt_id; ?>" id="cmtsid_<?php echo $cmt_id?>" /> 
       <textarea name="comment" placeholder="Give a reply..." class="reply-comment-field commentarea" id="replycomment_<?php echo $cmt_id?>"></textarea> 
       </form> 
      </div> 
<?php } ?>

請與jQuery/Ajax的幫助。

來源

2016-10-26 Shubham Jha

如果您有多個回覆鏈接，那麼您應該使用一類回覆而不是回覆ID，因爲ID應該是唯一的。 – Chris

http://jsbin.com/jupadozine/edit?html,js,output – Chris

謝謝克里斯..我的愚蠢..用班級取代..現在工作:) –

HTML

<div class="reply"><a href="javascript:;" data-rowid="1" class="click show-reply-box">Reply</a></div> 
<div class="reply-comment-holder" data-rowid="1" style="display:none;"> 
      <form method="post" action="#" class="full-width cmtform" id="cmt_form_id_1"> 
      <input type="hidden" name="status_id" value="1" id="cmtsid_1" /> 
      <textarea name="comment" placeholder="Give a reply..." class="reply-comment-field commentarea" id="replycomment_1"></textarea> 
      </form> 
     </div> 
<div class="reply"><a href="javascript:;" data-rowid="2" class="click show-reply-box">Reply</a></div> 
<div class="reply-comment-holder" data-rowid="2" style="display:none;"> 
      <form method="post" action="#" class="full-width cmtform" id="cmt_form_id_2"> 
      <input type="hidden" name="status_id" value="2" id="cmtsid_2" /> 
      <textarea name="comment" placeholder="Give a reply..." class="reply-comment-field commentarea" id="replycomment_2"></textarea> 
      </form> 
     </div>

的javascript

$(document).ready(function() { 
    $(".reply").on('click', 'a.click', function() { 
     var rowid = $(this).attr("data-rowid"); 
     $(".reply-comment-holder[data-rowid='" + rowid + "']").fadeToggle(800), 
     $(this).toggleClass(".reply-comment-holder[data-rowid='" + rowid + "']"); 
    }); 
});

jsbin列在上述評論。

來源

2016-10-26 17:58:11 Chris

jQuery點擊淡入隱藏元素while循環

回答

相關問題