首页 > 解决方案 > 按类名查找下一部分

问题描述

如何form_section通过单击显示下一个带有类的 div .btn_next

$(".form_section").hide();

$(document).on("click", ".btn_next", function(e) {
  $(this).next(".form_section").show();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row form_section">
  <div>
    <div></div>
    <div></div>
    <button class="btn btn-primary btn_next">SHOW NEXT SECTION</button>
  </div>
</div>
<div class="row form_section">
  <div>
    <div></div>
    <div></div>
    <button class="btn btn-primary btn_next">SHOW NEXT SECTION</button>
  </div>
</div>
<div class="row form_section">
  <div>
    <div></div>
    <div></div>
    <button class="btn btn-primary btn_next">SHOW NEXT SECTION</button>
  </div>
</div>

标签: jqueryhtml

解决方案


首先你需要隐藏当前的“ .form_section”部分(到被点击的按钮),然后得到下一个.form_section显示。

<script>

        //$(".form_section").hide();
        $(document).on("click", ".btn_next", function(e){
            $(this).parents('.form_section').hide();
            $(this).parents('.form_section').next().show();                
        }); 
    </script>

推荐阅读