Фильтрация дубликатов img src с помощью jQuery unique или remove

Question

Я пробовал разные обходные пути, которые обсуждались здесь, но ни один из них не работает в моем случае.

Это мой источник:

<div class="colourDots">
   <img src="/out/pictures/generated/product/8/300_450_100/60028.bl.jpg"/><br>
   <img src="/out/pictures/generated/product/8/300_450_100/60028.bl.jpg"/><br>
   <img src="/out/pictures/generated/product/8/300_450_100/60028.bl.jpg"/><br>
   <img src="/out/pictures/generated/product/8/300_450_100/60028.sw.jpg"/><br>
   <img src="/out/pictures/generated/product/8/300_450_100/60028.bl.jpg"/><br>
   <img src="/out/pictures/generated/product/8/300_450_100/60028.bl.jpg"/><br>
   <img src="/out/pictures/generated/product/8/300_450_100/60028.bl.jpg"/><br>

Я хотел бы показатьтолько уникальный "img src" из вышеприведенного списка, без дублирующихся изображений ...

Скрипт:

var uniqueImg = $(".colourDots img").get();
divs = $.unique(uniqueImg);

Я снова получаю тот же источник: - (

Любые идеи или какие-либо другие обходные пути?

Answer 1

Попробуйте это:

$(function(){
    var srcs = [],
        temp;
    $(".colourDots img").filter(function(){
        temp = $(this).attr("src");
        if($.inArray(temp, srcs) < 0){
            srcs.push(temp);   
            return false;
        }
        return true;
    }).remove();
});

Вот ссылка http://jsfiddle.net/xCjjp/

Answer 2

Вот еще одна версия, которую я собрал из всех ответов:

var img_array = $(".colourDots img").map(function() {
  return $(this).attr("src");
});
img_array = $.unique(img_array);
img_array.each(function(index, value){
    var sel = '.colourDots img[src="' + value+ '"]';
    $(sel).not($(sel + ':first')).remove();
});

http://jsfiddle.net/GZWY5/3/

Answer 3

Что я сделаю, так это сначала получу все эти теги изображения src attr в массив

var img_array = $(".colourDots img").map(function() {
  return $(this).attr("src");
});

Теперь здесь я могу выполнить проверку дубликатов в этом массиве и удалить все img, чьи srcвстречается более одного раза в этом массиве, здесь все img удалены, поэтому я добавлю обратно одно изображение src.

Answer 4

вы можете использовать:

$(".colourDots img").​​​​​​​​each(function(){
    if($(this).parent().length)
        $(".colourDots img:contains('" + $(this).jpg() + "')").not(this).remove();
});​

См. http://www.jquery4u.com/jquery-functions/jquery-each-examples/