在 JQuery 中使用数组 - 添加、删除、重复条目答案

【问题标题】：Working with Arrays in JQuery - Adding, Deleting, Duplicate entries在 JQuery 中使用数组 - 添加、删除、重复条目
【发布时间】：2013-03-04 04:12:09
【问题描述】：

我试图在单击时将 div id 添加到 jquery 数组中。在应用“选定”css 类的 div 上也有一个切换。当所选的CSS类在DIV上处于活动状态时，我只想将ID添加到DIV。除此之外，我在数组中遇到重复问题。我以为我正确地使用了独特的功能，但我想不是。

这是我正在使用的 HTML：

<div class="content">
            <a href="#item3" class="panel multi"><div class="circle skinCare multi" id="acne" style="top:10px;left:265px"><div class="inner_circle" id="acne">ACNE/</br>BLEMISHES</div></div></a>
            <a href="#item3" class="panel multi"><div class="circle skinCare multi" id="dry_skin" style="top:255px;left:10px"><div class="inner_circle" id="dry_skin">DRY SKIN</div></div></a>
            <a href="#item3" class="panel multi"><div class="circle skinCare multi" id="oily_skin" style="top:90px;left:100px"><div class="inner_circle" id="oily_skin">OILY SKIN/LARGE PORES</div></div></a>
            <a href="#item3" class="panel multi"><div class="circle skinCare multi" id="aging" style="top:90px;left:430px"><div class="inner_circle" id="aging">WRINKLES/</br>AGING</div></div></a>
            <a href="#item3" class="panel multi"><div class="circle skinCare multi" id="irritation" style="top:255px;left:510px"><div class="inner_circle" id="irritation">SENSATIVE SKIN/IRRITATION</div></div></a>
            <a href="#item3" class="panel multi"><div class="circle skinCare multi" id="dark_spots" style="top:430px;left:100px"><div class="inner_circle" id="dark_spots">DARK SPOTS</div></div></a>
        </div>

这里是 jQuery：

var skinCare=[];
$('.skinCare').click(function(){
    //var index = "Skin Care";
    if($('div.skinCare').css('background-color') == 'rgb(255, 0, 0)'){
        skinCare.push(event.target.id);

    }
    var skinCare1 = $.unique(skinCare);
    alert(skinCare1);

});

它将这个输出到警报中：

acne, aging, acne, acne, irritation

如果选择了某些东西，我需要它向数组添加一个 id，如果取消选择，我需要它从数组中删除它。

【问题讨论】：

但是event.target.id 总是一无是处

标签： jquery html arrays unique add

【解决方案1】：

$.unique 有据可查，仅适用于 DOM 元素：

摘自文档：

描述：对 DOM 元素数组进行原地排序，删除重复项。请注意，这仅适用于 DOM 元素数组，而不适用于字符串或数字。

API 参考：http://api.jquery.com/jQuery.unique/

使用$.inArray() 代替检查值

【讨论】：

【解决方案2】：

试试这个：

var skinCare=[];
$('.skinCare').on("click", function(){
    //var index = "Skin Care";
    var id = $(this).attr('id')
    if ($.inArray(id, skinCare) == -1)
        skinCare.push(id);
    else
        skinCare.splice( $.inArray(id, skinCare), 1 );

    alert(skinCare);
});

如果 div 的 id 不存在，它会将其推送到数组中，如果存在则将其删除。我认为也可以在切换事件上完成。

【讨论】：