Question

我已经写了一个脚本，它的功能也是我想要的但是选择器很糟糕，有没有人比我选择明智的选择有更好的建议？

我写的剧本就在这里，但根本没有说服力！ http://jsfiddle.net/xxsqye3q/

只是因为小提琴在某些时候失踪了：

$('body').on('click','.js_spec', function(e){
    e.preventDefault();
    $('.file-spec-container').slideUp(200);
    $(this)
    .parent()
    .first()
    .next()
    .children()
    .closest('.file-spec-container:hidden')
    .slideDown(200);
})

Answer 1

目标.file-spec-container元素是当前元素父元素的下一个兄弟的后代

$('body').on('click', '.js_spec', function (e) {
    e.preventDefault();
    var $target = $(this)
        .parent()
        .next()
        .find('.file-spec-container:hidden')
        .slideDown(200);
    $('.file-spec-container').not($target).slideUp(200);
})

演示：Fiddle

Answer 2

使用find已经是更好的一步：

$('body').on('click','.js_spec', function(e){
    e.preventDefault();
    $('.file-spec-container').slideUp(200);
    $(this)
        .parent().find('.file-spec-container:hidden')
        .slideDown(200);
})

编辑：

由于一些评论出现让我第二次猜测我的原始答案或许这会让它变得更简单？

$('body').on('click', '.js_spec', function (e) {
    e.preventDefault();
    $('.file-spec-container').slideToggle(200);
})

过于复杂的选择器，需要变得简单

2 个答案: