我想隐藏并在每次点击时显示div

Question

我想隐藏并在每次点击时显示一个div，但它只显示和隐藏一次，但它从未在按钮点击时再显示

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

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a class="btn-read-more comnt-area-view ">Add Comment</a> <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> <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> 

Answer 1

我在你的代码中做了很少的修改。 如果这有用，请告诉我。 谢谢。 这是plunker https://plnkr.co/edit/KFh5EoROlsFs70U45jD4?p=preview

$(document).ready(function() {

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

  $(".comnt-area-view").click(function() {
    if ($(this).next()[0].style.display == 'none')
      $(this).next().show()
    else
      $(this).next().hide()

  });
});

Answer 2

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

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="comments"> <a class="btn-read-more comnt-area-view ">Add Comment</a> <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="comments"> <a class="btn-read-more comnt-area-view ">Add Comment</a> <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>