Question

我在菜单链接列表中使用html的data-属性，以便将链接绑定到单击链接时要打开的内容部分的div。因此，如果我有一个名为“＃section1”的隐藏div，那么打开该链接的链接就是。

目前，为了找到与此链接匹配的div，我使用jquery .each（）来遍历所有可能的元素，但似乎应该有更好的方法。

有没有人知道如何简化此代码并找到匹配的元素而无需在循环中运行代码？

这是我的代码：

$('a.hidden_link').click(function(){
    section_ident = $(this).attr('data-ident');
    $('.hidden_section').each(function(index) {
        if ($(this).attr('data-ident') == section_ident){
            section_ref = $(this);
            section_ref.show();
        }
    });
});

Answer 1

这应该有用。

$('a.hidden_link').click(function(){
    $(".hidden_section[data-ident='"+$(this).attr('data-ident')+"']").show();
});

Jsfiddle，http://jsfiddle.net/playerace/H7jwb/

Answer 2

$('.hidden_section[data-ident="' + section_ident + '"]').show();

所有在一起：

$('a.hidden_link').click(function(){
    var section_ident = $(this).attr('data-ident');
    $('.hidden_section[data-ident="' + section_ident + '"]').show();
});

Answer 3

这听起来像是jQuery.filter()的工作！

$('a.hidden_link').click(function(){
    var section_ident = $(this).data('ident');
    $('.hidden_section').filter(function() {
        return this.attributes["data-ident"] == section_ident;
    }).show();
});

jquery - 查找具有与其他元素数据属性匹配的id的元素的最佳方法

3 个答案: