找到匹配的img src并删除如果存在多次 - Javascript

时间:2015-09-24 19:58:23

标签: javascript jquery html append

只要点击另一个列表中的图像,我就会将图像附加到无序列表中。所以基本上将图像从一个列表传递到另一个列表。但是我想检查刚刚传递给新列表的图像是否已经存在,是否确实阻止它添加该图像。 (或者删除它,如果已经附加了它。)

目前我有以下

$('.slick-slide').on('click', function(){
    var img = $(this).find("img");
    var img_src = $(img).attr('src');
    var full_src = "<li><img class='basket-image' src='"+img_src+"'/></li>";
    $(full_src).appendTo(".light-basket");
    checkBulbSrc(img_src);
});

function checkBulbSrc(clickedSource) {

    $('.light-basket').find('li').each(function() {
      var basket_img = $(this).find("img");
      var basket_img_src = $(basket_img).attr('src');

      if(basket_img_src == clickedSource){

      }
    });
};

我有附加工作,但是现在我想让checkBulbSrc函数检查该图像是否已经存在,而不是添加它。我想我可能需要将原始图像srcs加载到一个数组中,然后在追加之前检查它?

有什么想法吗?

d

1 个答案:

答案 0 :(得分:0)

您需要的只是以下内容。

//Get a reference to the element
var $lightBasket = $(".light-basket");

$('.slick-slide').on('click', function() {

    var img = $(this).find("img");
    var img_src = $(img).attr('src');
    var full_src = "<li><img class='basket-image' src='"+img_src+"'/></li>";

    //If the image doesn't exist, then append
    if ( !$lightBasket.find("img[src='"+img_src+"']").length ) {
        $lightBasket.append(full_src);
    }
});