Question

我有一个下拉功能，我只需要点击div，而不是所有（当点击某个时，我需要在页面上显示14个相同的类）

目前我的jQuery如下。

$('.qacollapsed').hide();
$('.qa').click(function () {
    $('.qacollapsed').slideToggle();
    $(this).toggleClass('active');
});

当然，当页面上有14个时，切换所有qacollapsed类（Q＆amp; A）

有没有办法只删除点击的那个？

HTML

<div class="qa">
<h4 class="question"> </h4>
</div>

<div class="qacollapsed">
<p>  </p>
</div>

Answer 1

Yo可以找到（）它或使用this作为选择器中的上下文，只选择被点击对象的后代

$('.qa').click(function () {
    $('.qacollapsed', this).slideToggle();
    //You could do $(this).find('.qacollapsed').slideToggle();
    $(this).toggleClass('active');
});

Answer 2

在这里提供一个HTML片段会很有帮助，但我现在会猜测你的标记结构。

您需要find元素，而不是引用所有.qacollapsed元素，而这些元素与点击的.qa相近，例如：

$('.qa').click(function () {
   $(this)                     // start with the clicked element
       .find('.qacollapsed')   // find child .qacollapsed elements only
       .slideToggle();
   $(this).toggleClass('active');
});

如果.qacollapsed位于.qa内，这将有效 - 如果不是，您可能需要使用next（对于兄弟姐妹），或其中一个jQuery tree traversal methods。< / p>

Answer 3

查看jQuery selectors，为什么不使用$(this)？

Answer 4

$('.qacollapsed').hide();
$('.qa').click(function () {
    $(this).toggleClass('active').next().slideToggle();
});

Answer 5

就个人而言，我会给所有divs ID，可点击的位是数据库中问题的ID，例如，答案只是id ='ID_answer'或其他东西，然后使用jquery在div中滑动与点击的链接对应的id，即

 Var showIt = $(this).attr('id') + '_answer'
 $('.qacollapsed').not('#'+showIt).hide();
 $('#'+showIt).slideToggle;

这将隐藏没有该ID的所有div并显示所需的div。

Dexter使用上面的.next看起来更简单，我没有尝试过，因为它对jquery来说也相对较新。

jQuery单击函数使用相同的类

5 个答案: