在站点中多次使用该类时如何选择

Question

在多个地方使用特定类别时如何选择。 我想在单击“ comnt-area-view类”时显示“ disp-comment类”，comnt-area-view类和disp-comment类在文档中使用了2次

我尝试使用$（this）.next，$（this）.find（className）和$（clasName，this），但是它不起作用

<script>


$(document).ready(function(){

 $(".disp-comment").hide();

     $(".comnt-area-view").click(function(){
     alert("hello");
        $(this).next(".disp-comment").show()

  });
});
</script>

<html>
 <a   class="btn-read-more comnt-area-view ">Add Comment</a><br/>
                  <div  class="user-name disp-comment">
                  <input type="text"  class="form-control cmnt-namefld" placeholder="Enter your name" >
                  <textarea class="cmnt-txtarea"  rows="4"  cols="40" name="comment" form="usrform"></textarea>

                  <input type="button" class="cmnt-btn" value="comment">

                  </div>

 <a   class="btn-read-more comnt-area-view ">Add Comment</a><br/>
                  <div  class="user-name disp-comment">
                  <input type="text"  class="form-control cmnt-namefld" placeholder="Enter your name" >
                  <textarea class="cmnt-txtarea"  rows="4"  cols="40" name="comment" form="usrform"></textarea>

                  <input type="button" class="cmnt-btn" value="comment">

                  </div>
</html>

Answer 1

问题是因为next()元素形式.comnt-area-view是<br /> ，而不是.disp-comment元素。

有两个解决方案。 第一种方法是删除<br />元素并使.comnt-area-view元素在CSS中display: block ：

.comnt-area-view {
  display: block;
}

第二个是改为使用nextAll() ：

$(this).nextAll('.disp-comment').first().show();

Answer 2

您必须添加一个父容器，相对于它，您必须找到所需的区域，如下所示：

 $(document).ready(function() { $(".disp-comment").hide(); $(".comnt-area-view").click(function() { alert("hello"); $(this).parent('.aParentDiv').find(".disp-comment").show(); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="aParentDiv"> <a class="btn-read-more comnt-area-view ">Add Comment</a><br/> <div class="user-name disp-comment"> <input type="text" class="form-control cmnt-namefld" placeholder="Enter your name"> <textarea class="cmnt-txtarea" rows="4" cols="40" name="comment" form="usrform"></textarea> <input type="button" class="cmnt-btn" value="comment"> </div> </div> <div class="aParentDiv"> <a class="btn-read-more comnt-area-view ">Add Comment</a><br/> <div class="user-name disp-comment"> <input type="text" class="form-control cmnt-namefld" placeholder="Enter your name"> <textarea class="cmnt-txtarea" rows="4" cols="40" name="comment" form="usrform"></textarea> <input type="button" class="cmnt-btn" value="comment"> </div> </div>

在站点中多次使用该类时如何选择

问题描述

2 个解决方案

解决方案1
0 2018-08-08 10:31:51

解决方案2
0 2018-08-08 10:32:51

在站点中多次使用该类时如何选择

问题描述

2 个解决方案

解决方案1 0 2018-08-08 10:31:51

解决方案2 0 2018-08-08 10:32:51

解决方案1
0 2018-08-08 10:31:51

解决方案2
0 2018-08-08 10:32:51