jQuery onclick show first parent div

Question

我在点击时显示父div 时遇到问题。如这里：

 $('#click').click(function() {
    $(this).parent().closest('div').slideToggle("fast");
});
http://jsfiddle.net/bk1hLoyb/

我需要在单击时显示 .showdiv，并且在单击另一个时需要隐藏第一个。有人知道一种方法吗？非常感谢

Answer 1

Id 在页面上应该是唯一的。

$('.click').click(function() {
        $('.show').hide();
        $(this).find('.show').slideToggle("fast");
    });

http://jsfiddle.net/bk1hLoyb/11/

Answer 2

第一个 ID 必须是唯一的，因此请将其更改为：

<li class="click">
        <a href="#">Bye</a>
        <div class="show">Hey</div>
</li>

代码将其更改为：

$('.click').click(function() {
        $(this).find('div').slideToggle("fast");
});

现场演示

Answer 3

一些建议：

• 删除所有重复的 ID
• 如果必须在li元素上使用选择器，请使用类
• .show是点击li的子项，因此无需使用 .parent() 或 .closest() 。

法典：

$('.click').click(function() {
    $('.show', this).slideToggle("fast");    
});

演示

奖金

• $(elm).find('.selector')相当于$('.selector', elm)
• 也写成jQuery( selector [, context ] )
• 如果未指定context，则假定它document
• 因此 $（elm） 等价于 $（elm， document）

Answer 4

在"li"上将 id 更改为一个类，以便您可以引用多个div。

然后在脚本上看起来像这样：

$('.click a').click(function() {
    var item = $(this);
    $(this).parent().siblings().find('.show').slideUp(400,function(){
        item.parent().find('.show').slideDown(400);
     });
});

看到它在你的小提琴上工作（很抱歉在没有分叉的情况下更新）