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

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(','));
});

演示

Answer 3

检查小提琴

$(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());        
    });
});​