2016-11-21 4 views
1

Это синтаксис кодирования (ярлык?), Который я только что нашел.jQuery .on() shortcut синтаксис против делегирования

На прошлой неделе я действительно озадачен this .on() syntax.

Основное использование, которое я делал с .on(), до сих пор заключалось в деле делегировании событий (ов) на динамически добавленные элементы.

Как так:

$("[selector]").on("[event,event,event,...]","[delegate selector]",function(){ 
    //... Something. 
}); 

Это обычное использование для связывания ONE обработчик из коллекции в другую (динамический ребенка) в отношении одного или нескольких событий.


Но, теперь, когда я знаю о существовании в this .on() syntax ...
Что является более «событием конкретного» и действительно позволяет быть более краткими в написании кода:

$("[selector]").on({ 
    [event]:function(){ 
     //...Something 
    }, 
    [event]:function(){ 
     //...Something else. 
    } 
}); 

Я вижу этот (новый для меня!) синтаксис как предоставление объекта в качестве аргумента для .on().
Даже многие объекты, комы разделены.

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

Но теперь ...

Как делегировать события из «OnLoaded» селекторном динамически добавленным ребенка, используя этот синтаксис?

Возможно ли это?
Пожалуйста, скажите мне, да, и покажите мне, как!

ответ

1

Как передать события из селектора «onloaded» в динамически присоединяемый дочерний элемент, используя этот синтаксис?

Синтаксис вы ищете это:

$('staticParentElement').on({ 
    [event]:function(){ 
     //...Something 
    }, 
    [event]:function(){ 
     //...Something else. 
    } 
}, 'dynamicDescendants'); 
+0

Хаа ... Спасибо человек! ;) –

+0

Только «undefined» * Пользователь SO мог бы ответить на это! –

+0

Добро пожаловать! Я рад, что могу помочь. – undefined