2016-06-07 11 views
-1

У меня есть группа изображений, каждая из которых имеет data-type="type,type", поэтому для облегчения моей жизни я намерен захватить тип данных и сделать их в массив (завернутый каждый из них в промежутке) и присоединить их к элементу категории.Удалить дублируемое значение, сгенерированное данными элемента

$('li.grid-item').each(function() { 
    // grab a reference to the current li 
    var $el = $(this); 
    // get the url from its data-class attribute 
    var arr = $el.find('img').data('type').split(','); 

    $.each(arr, function (index, value) { 
     $el.find('.category').append('<span>' + value + '</span>'); 
     $el.addClass(value); 
    }); 
}); 
<li class="grid-item"> 
    <figure> 
     <img src="img/sticker/still/sticker_30.png" alt="sticker" title="You know I'm good" data-type="others/" data-price="9 bahts" data-alt="img/sticker/ani/sticker_30.gif" /> 
    </figure> 
    <a href="#"> 
     <span class="download ala_carte">CONTINUE</span> 
    </a> 
    <div class="category"></div> 
</li> 

Он отлично работает, но дублируется 20 из каждого значения, пожалуйста, помогите. Как удалить значение дублированного массива? Пожалуйста, помогите, спасибо заранее.

+1

Я не вижу ничего тиражирующего 20x. https://jsfiddle.net/atg5m6ym/5587/ – chungtinhlakho

+0

Что сказал @chungtinhlakho! Пробовал это и в другой скрипке, я не могу воспроизвести эту проблему. Это либо какая-то проблема с каким-то другим кодом, либо чем-то еще. Предоставьте больше информации, пожалуйста! –

+0

[link] (http://greysaga.com/demo/ms/) Я положил его сюда, посмотрю, спасибо! –

ответ

0

Я думаю, что лучше собрать все существующие типы сначала в массиве (и добавлять к нему новые значения, если они еще не были). Впоследствии вы можете добавлять элементы span для каждого типа. И вы должны иметь только один контейнер категории, чтобы перечислить все типы.

Update

Ваша функция выполняется часто (более чем в 20 раз), потому что вы вызываете его каждый ваш $ grid.imagesLoaded() делает прогресс. Назовите это, когда вы «сделаны». Попробуйте заменить

$grid.imagesLoaded().progress() 

с

$grid.imagesLoaded().done() 

для вызова функции только один раз после того, как будут загружены все изображения. Кроме того, вы можете очистить контейнер категории перед повторным заполнением.

+0

Спасибо, Eytibi, но я не знаю как. Пожалуйста, посмотрите [demo] (http://greysaga.com/demo/ms/), тогда вы поймете, что я имею в виду. Я думаю ... lol –

+0

Думаю, я нашел вашу проблему. Ваша функция выполняется часто (более 20 раз), потому что вы вызываете ее каждый раз, когда ваш $ grid.imagesLoaded() делает прогресс. Назовите его, когда вы «сделали» Попробуйте заменить «$ grid.imagesLoaded(). Progress (function()» с «$ grid.imagesLoaded(). Done (function()» Кроме того, вы можете очистить контейнер категории перед тем, как заново заполнить его. – Eytibi

+0

WOW! It WORKS !!!! Спасибо !!!! Теперь как это отметить, поскольку мой вопрос получил ответ? Извините, я новичок, я немного искал Google, но могу найти зеленую галочку. –

Смежные вопросы