В jQuery, как делает this.each () работа?
Для создания моего вопроса более конкретным я прочитал документацию относительно .each () для jQuery, но я немного более смущен. У меня есть этот код:
$.fn.imgAreaSelect = function (options) {
options = options || {};
this.each(function () {
if ($(this).data('imgAreaSelect')) {
if (options.remove) {
$(this).data('imgAreaSelect').remove();
$(this).removeData('imgAreaSelect');
}
else
$(this).data('imgAreaSelect').setOptions(options);
}
else if (!options.remove) {
if (options.enable === undefined && options.disable === undefined)
options.enable = true;
$(this).data('imgAreaSelect', new $.imgAreaSelect(this, options));
}
});
if (options.instance)
return $(this).data('imgAreaSelect');
return this;
};
Теперь то, что я не получаю об этом, - то, что, почему каждый функционирует не, имеют индекс или элемент? Этот отрывок кода от плагина jQuery, который я пытался перечитать. Я также не вполне понимаю $ .fn. наверху, я знаю, что он обозначает прототип, но что точно продолжается здесь?
3 ответа
Функция each может принимать в качестве параметра функцию, принимающую индекс, но это необязательно.
Для простоты .each был реализован для того, чтобы this ссылался на текущий элемент.
Однако .each может принимать индекс в качестве параметра обратного вызова.
Пример такого использования есть в jQuery API
$('li').each(function(index) {
alert(index + ': ' + $(this).text());
});
Reference
$('li').each(function(index) {
alert(index + ': ' + $(this).text());
});
Ему не нужен индекс, поскольку this обеспечивает контекст. Как отмечается в docs, "к значению можно также получить доступ через ключевое слово this". Для этого используется call. Что-то вроде:
userFunction.call(valueOfElement, indexInArray, valueOfElement);
$.fn.imgAreaSelect = function (options) означает, что функция добавляется к прототипу. Это позволяет использовать ее с любым экземпляром объекта jQuery.
$. Each (fn) вызывает fn для каждого элемента, содержащегося в текущем контексте. Каждый раз, когда он вызывает fn , он передает «текущий» элемент как this .
Итак, в следующем примере:
$("div").each(function() {
alert(this.className);
});
Выдает по одному предупреждению для каждого