Привязать функцию к нескольким элементам jQuery одновременно

#javascript #jquery #jquery-selectors

#javascript #jquery #jquery-селекторы

Вопрос:

У меня есть 3 объекта jquery:

 var a = $('.el1');
var b = $('.el2');
var c = $('.el3');

И я хочу привязать событие «изменение» ко всем из них сразу, но я не могу:(

$(a, b, c).bind('paste input change', function(){ ... }); просто не работает…

Но если привязать ее к каждому элементу отдельно, это работает:

 a.bind('...');
b.bind('...');
c.bind('...');

Возможно ли сделать это более коротким способом?

(И без передачи классов в качестве селекторов)

1. Вы пробовали $('.el1, .el2, .el3').bind ?

2. да, и я знаю, что это работает, но я не хочу этого делать, потому что объекты используются в других местах, и мне не нравится работать с классами через весь скрипт. Мне нравится использовать их только в начале 🙂 (например. в случае изменения классов мне не нужно искать по всему сценарию)

Ответ №1:

Используйте .add() ^[docs]:

 a.add(b).add(c).bind(...

Ответ №2:

$([a,b, c]).привязка должна работать, как в:

 var a = $('.el1');
var b = $('.el2');
var c = $('.el3');

$([a,b,c]).each(function(idx){
    $(this).bind('click', function(){
       alert($(this).text());
    });
});

Ответ №3:

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

 $('.el1, .el2, .el3').bind(....)

Ответ №4:

Используйте $('.el1, .el2, .el3').bind(.... .

Другое решение — объединить их позже:

 var d = a;
d.add(b);
d.add(c);

d.bind(....

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

1. действительно ли функция объявляется 3 раза?

2. Что ж, вероятно, есть некоторая оптимизация, чтобы предотвратить это, но она, по крайней мере, будет проанализирована три раза и проверена по хэшу существующих функций, чтобы увидеть, совпадает ли она.

3. Распространенной ошибкой .add() метода является то, что он НЕ добавляет элемент к текущему объекту jQuery. Он возвращает новый объект jQuery с добавлением его. Итак, вам нужно d = d.add(b) добавить b в d .