Question

如何显示包含按第一个属性分组的元素第二属性的警报，例如：

<a href="#b" attA=1 attB=18 >Here</a>
<a href="#b" attA=1 attB=27>Here</a>
<a href="#b" attA=1 attB=31>Here</a>
<a href="#b" attA=2 attB=84>Here</a>

当您点击任何attA链接时，它会显示：

alert("atta=1 and attB=18,27,31");

然后点击attB：

alert("atta=2 and attB=84");

很难，不是吗？

Answer 1

attA不是有效属性，您可以使用data-*属性，但请注意您应该使用引号来包装值。

<a href="#b" data-atta='1' data-attb='18'>Here</a>
<a href="#b" data-atta='1' data-attb='27'>Here</a>
<a href="#b" data-atta='1' data-attb='31'>Here</a>
<a href="#b" data-atta='2' data-attb='84'>Here</a>

$('a').click(function() {
    var a = this.dataset.atta;
    var b = $('a[data-atta='+a+']').map(function() {
        return this.dataset.attb
    }).get().join();
    alert('atta: ' + a + ", attb=" + b)
})

http://jsfiddle.net/XrF4p/

Answer 2

$('a').click(function() {
    var attA = $(this).attr('attA'),
        attB = $.map($('a'), function(link){
            if($(link).attr('attA') == attA) {
                return $(link).attr('attB');
            }
        });

    alert('atta=' + attA + ' and attB=' + attB.join(','));
});

demo

Answer 3

Check FIDDLE

$(function() {
    $('a').on('click', function(e) {
        e.preventDefault();
        var $attA = $(this).attr('attA');
        var $attB = $('a[attA="'+ $attA +'"]');
        var arr = [];
        $.each($attB, function(){

             arr.push( $(this).attr('attB'));
        });
        alert('attA - ' + $attA + ' :: attB - '+ arr.join());        
    });
});

按第一个属性对元素进行分组

3 个答案: