admin 管理员组

文章数量: 1086019

Below are my elements.

<div class="first-div">
   DIV 1
   <button class="next">Next</button>
</div>
<div class="next-div" style="display:none;">
   DIV 2
   <button class="back">Back</button>
   <button class="next">Next</button>
</div>
<div class="next-div" style="display:none;">
   DIV 3
   <button class="back">Back</button>
   <button class="next">Next</button>
</div>
<div class="next-div" style="display:none;">
   DIV 4
   <button class="back">Back</button>
</div>

How can I select the very next hidden .next-div element and show it and select the very previous hidden element and show it using jQuery?

Below are my elements.

<div class="first-div">
   DIV 1
   <button class="next">Next</button>
</div>
<div class="next-div" style="display:none;">
   DIV 2
   <button class="back">Back</button>
   <button class="next">Next</button>
</div>
<div class="next-div" style="display:none;">
   DIV 3
   <button class="back">Back</button>
   <button class="next">Next</button>
</div>
<div class="next-div" style="display:none;">
   DIV 4
   <button class="back">Back</button>
</div>

How can I select the very next hidden .next-div element and show it and select the very previous hidden element and show it using jQuery?

  • javascript
  • jquery
  • html
Share Improve this question asked Aug 6, 2015 at 13:18 O ConnorO Connor 4,43216 gold badges56 silver badges102 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 7

You can use:

$('.next').click(function(){
   $(this).parent().hide().next().show();//hide parent and show next
});

$('.back').click(function(){
   $(this).parent().hide().prev().show();//hide parent and show previous
});

Working Demo

本文标签： javascriptHow to show the very next div on button click with jQueryStack Overflow

版权声明：本文标题：javascript - How to show the very next div on button click with jQuery? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://roclinux.cn/p/1743988218a2514242.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。