jquery - 多个相同 div 上的 jQuery，不使用唯一 ID？

Question

简而言之问题：我正在尝试仅在您单击的元素上进行简单的显示/隐藏切换，而现在所有（13）个 div 都会受到该功能的影响。

每个 div 的结构如下所示

<div class="selectbox">
    <h5>Title</h5>
    <p>
        Content
    </p>
</div>

使用此 jquery 代码

$('.selectbox h5').click(function(){
         $('div.selectbox,p,span').toggle();
         $('.selectbox').toggle();
    });

所以现在，jquery 工作。但显然，它对页面上的每个“选择框”div 都有效。如何仅在我单击的元素上进行此操作，而不为每个“选择框” div 使用唯一的 id？

Answer 1

$('.selectbox h5').click(function(){
     $(this).parent().find('p,span').toggle(); 
     $(this).parent().toggle(); // this line should probably be removed 
});

Answer 2

使用$(this)-

$('.selectbox h5').click(function(){

  $(this).closest('.selectbox, p, span').toggle();
  //$('.selectbox').toggle();

});

Answer 3

您可以在函数中使用关键字this，它表示触发事件的项目。在这种情况下，您的 H5。

$('.selectbox h5').click(function(){
         $(this).closest('.selectbox').toggle();
    });

Answer 4

简单点。。

如果您希望父 DIV 切换，那么只需 $(this).parent().toggle(); 在您的函数中使用。pe：如果你想<p>在你的 div 中使用，你可以像这样处理它$('p', $(this).parent()).toggle();