Javascript 不允许将重复项推入数组

基本上，我将容器推入一个数组，一旦一个容器被推入，我就不想再让同一个容器被推入

这是我的JSFIDLE：

Javascript:

$(document).ready(function(){

var favorites = [];
var counter = 0;

    $('.containers').on('click', function(){

        favorites.push($(this).clone())

        $('.favorite').append(favorites);
    });


});

---

我需要找到一种方法来解决这个问题。

除非单击事件有更多内容，否则您可以使用

.one（）

方法代替

上的
.on来获得此功能

$(document).ready(function(){

    var favorites = [];
    var counter = 0;

    $('.containers').one('click', function(){

        favorites.push($(this).clone())

        $('.favorite').append(favorites);
    });    

});


即使还有更多，您仍然可以使用
.one（）
：

您可以检查元素是否已存在：

$（文档）.ready（函数（）{
var=[]；
$（'.containers'）。在（'click'，function（）上{
var=false；
对于（变量i=0；i
将类添加到已推送的项目中，然后执行基本检查：
而不是：

favorites.push($(this).clone())

你可以做：

if( !$(this).hasClass("pushed") ) {
    favorites.push( $(this).addClass("pushed").clone() );
}

我会说，试着检查元素id。大概是这样的：

$(document).ready(function(){

var favorites = [];
var counter = 0;

    $('.containers').bind('click', function(){
        var isAdded = false;
        for (var f = 0; f < favorites.length; f++) {
            console.log(favorites[f].id + "|" + this.id);
             if (favorites[f].id === this.id)
                 isAdded = true;
        }

        if (!isAdded)
            favorites.push($(this).clone()[0])


         console.log(favorites);
        $('.favorite').append(favorites);
    });


});

$（文档）.ready（函数（）{
var=[]；
var计数器=0；
$（'.containers'）.bind（'click'，function（）{
var isAdded=假；
对于（var f=0；f

下面是一个工作示例->

mz
只需推动元素本身，而不是克隆它：

favorites.push($(this))

附加的好处是，它给用户一个提示，即该项目已经被添加

现场演示：
似乎是您想要的。它返回数组中值的索引。如果未找到，则返回-1

这是一种新的数组方法，因此您需要使用polyfill才能在旧浏览器上工作

$(document).ready(function(){

    var favorites = [];
    var counter = 0;

    $('.containers').on('click', function(){
        var clone = $(this).clone(); // caching element

        if (favorites.indexOf(clone) !== -1) {
            favorites.push(clone);
        }

        $('.favorite').append(favorites);
    });
});

这可以使用JS代理（）完成

下面是创建不接受复制项的数组的代码

var arr = new Proxy([], {
  get: function(target, key) {
    return target[key];
  },
  set: function(target, key, value){
    if(target.indexOf(value)>=0) return false;
    target[key] = value;
    return true
  }
});
arr.push(100);
arr.push(100); // this will throw error

在上面的代码中，我们正在修改数组的默认行为，因为对数组所做的任何修改都将调用set方法。
添加一个
e
，例如，
$（'.containers'）。一个（'click'，
您还可以添加一个
$（this）.data（'favorites'，true）
我不确定我是否理解。我尝试了JSFIDLE，每个容器在我看来只推一次。你的意思是你不希望具有相同内容的容器被推多次吗？问题是，
收藏夹[I]
永远不会等于
$（这）
因为它们是两个不同的元素，即使它们具有相同的内容/属性。
var a={}；var b={}；console.log（a==b）；/false
这是什么意思，为什么它们会不同？请参阅我更新的注释，两个不同的对象永远不会相等。
var a={}；var b={}；console.log（a==b）；/falseobjectYou可以做
$（这个）。不（'.push'）
太多。@JaredFarrish是的，而且它也更可读，但我倾向于不使用过滤器，因为它们是。确实如此。在大量的DOM
类
名称测试列表中，您肯定有一个观点。
$(document).ready(function(){

    var favorites = [];
    var counter = 0;

    $('.containers').on('click', function(){
        var clone = $(this).clone(); // caching element

        if (favorites.indexOf(clone) !== -1) {
            favorites.push(clone);
        }

        $('.favorite').append(favorites);
    });
});

var arr = new Proxy([], {
  get: function(target, key) {
    return target[key];
  },
  set: function(target, key, value){
    if(target.indexOf(value)>=0) return false;
    target[key] = value;
    return true
  }
});
arr.push(100);
arr.push(100); // this will throw error