добавление уникальной функции img src в JQuery

Question

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

У меня есть следующий фрагмент кода или, вернее функцию в моей JQuery плагин:

function get_prop(current){ 
     var temp = current.attr('src'); 
     if ($.inArray(temp , src_storage)) { 
      console.log('already in array');  
     }else{ 
      src_storage.push(temp);    
     } 
    } 

массив объявлен в глобальном масштабе плагина:

src_storage = []; 

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

когда я упрощать выше код функции к следующему:

function get_prop(current){ 
     var temp = current.attr('src'); 
     src_storage.push(temp); 
    } 

все СРК-х выбранных IMG-х добавляются в массив, однако это становится слишком дубликат ЦСИ годов.

Функция $ .inArray, похоже, не работает так, как я ожидал.

Путь я вызвать функцию следующим образом:

$(img).pluginname(); 

так как я идти о тонкой настройке моя функция в настоящее время?

Весь исходный код плагина здесь, упаковывают u'd нравится иметь вид:

Source code

Спасибо.

Tenali.

Answer 1

Вы можете использовать .indexOf, чтобы проверить, существует ли значение в массиве. Проверьте возвращаемое значение для -1, если оно не найдено. См: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf

(Вы можете сделать это с помощью JQuery $.inArray тоже, просто проверить -1)

Вот пример плагина. Передача массива в качестве параметра для подключаемого модуля. Убедитесь, что теперь массив содержит только 3 источника, а не 4 в примере.

Отрывок:

(function ($) { 
 
    $.fn.extend({        // defining the plugin 
 
     saveSource: function (arr) {   // the plugin func with argument 
 
      return this.each(function() {  // return all objects for chaining 
 
       var src = this.src;    // get the src attribute of the image 
 
       if (arr.indexOf(src) === -1) { // check if it exists in given array 
 
        arr.push(src);    // add it to the end if not exists 
 
       } 
 
      }); 
 
     } 
 
    }); 
 
})(jQuery); 
 

 
var srcList = [];    // declare the array 
 
$("img").saveSource(srcList); // call the plugin on all images with the array argument 
 
snippet.log(srcList);   // check the array contents

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script> 
 
<img src="http://placehold.it/32x32" /> 
 
<img src="http://placehold.it/32x32" /> 
 
<img src="http://placehold.it/31x31" /> 
 
<img src="http://placehold.it/33x33" />

_{* Использование сценария TJ Краудера для console.log к snippet.log.Смотрите здесь: https://meta.stackexchange.com/a/242144/230147 и здесь: https://meta.stackexchange.com/a/242144/134069}

Answer 2

Проблемы у вас есть эта линия:

if ($.inArray(temp , src_storage)) 

Поскольку $.inArray эмулирует родную Array.prototype.indexOf() оценка возвращает индекс элемента, если найдено, или -1 если не. -1 по-прежнему остается правдой; так что вместо этого:

if ($.inArray(temp , src_storage) === -1) 

Кстати, когда метод JavaScript не работает, часто лучше, чтобы проверить документацию, которая, в данном случае, очевидно, объясняет, что происходит:

Метод $.inArray() похож к встроенному JavaScript методу .indexOf(), в котором он возвращает -1, когда он не находит совпадения. Если первый элемент в массиве соответствует значение, $.inArray() возвращает 0.

Ссылки:

• $.inArray().

Answer 3

Проблема заключается в вашей строке кода:

if ($.inArray(temp , src_storage)) { 

вы должны проверили его, как показано ниже:

if ($.inArray(temp , src_storage) != -1) { 

как он возвращает -1 для не нашел и «позицию массива 'для любого найденного элемента массива

Проверьте мой тест:

http://jsfiddle.net/6g7m345r/