Как в JQuery плагине сделать так, чтобы this в передаваемой функции стал равен элементу, к которому применяется плагин?

Question

Как в JQuery плагине сделать так, чтобы this в передаваемой функции стал равен элементу, к которому применяется плагин?

vsemprivet 2019 Ученик (54), закрыт 4 года назад

Есть такой код.
https://jsfiddle.net/y9n2L63a/

По комментариям в JS понятно, что я хочу сделать. Как это сделать?

Answer 1

this в js определяется на лету в момент вызова функции в которой он используется. И заранее сделать его равным чему то нельзя.
в кратце он динамический зависит от контекста в котором используется.

vsemprivet 2019Ученик (54) 4 года назад

Хорошо. А как надо изменить код, чтобы добиться того, чего я хочу?

del Мудрец (18891) Тебе не код изменить нужно а для начала научится пользоваться отладчиком. поставить точку остановки. обратить на правую часть где отображен текущий контекст исполнения и на что указывает this. Потом сделать следующий шаг посмотреть как изменился контекст. Js имеет простую логичную и очевидную древовидную структуру размещения и доступности переменных в памяти.

ЯрославИскусственный Интеллект (107837) 4 года назад

Проблема в том, что вопрос о черезжопной библиотеке jQuery))
И this там является объектом jQuery.

del Мудрец (18891) this может быть чем угодно советую его избегать по возможности ну может кроме конструкторов где он может быть полезен. jQuery вроде свой объект в прототип возвращаемого объекта подсовывала. Поэтому возвращаемый объект выглядит как объект jQuery но на самом деле является его прототипным наследником.

Answer 2

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

$.fn.logClasses = function () {
return this.each(function () { console.log(this.className); });
};
for (let i = 0; i < 10; i++)
$('body').append('<div class="example"></div>');
$('.example').logClasses(); // 10 раз выведет 'example'

Answer 3

Можно передать this через переменную функции...

$.fn.some_plugin = function(foo) {
  return this.each(function() {
    foo(this);
  });
}

$('.some_div').some_plugin(function(elem) {
  console.log(elem);
});

Answer 4

Илья Ш Просветленный (20163) 4 года назад

https://jsfiddle.net/xvbh3ku4/1/