2012-01-03 3 views
2
$('#container').on('click', 'a',function().. 

иселектор JQuery используя

$('#container a').on('click',function().. 

В чем разница между двумя селекторами.

+0

http://24ways.org/2011/your-jquery-now-with-less-suck Просмотрите раздел делегирования событий – jondavidjohn

ответ

3

Первый свяжет все текущие и будущие метки привязки, в то время как второй будет привязан только к существующим тэгам привязки.

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

Edit: Ответ на комментарий, так как он довольно долго

Первый полезен для динамического контента или контента, который содержит много якорных тегов. Первая привязывает только одно событие, которое прослушивает события, которые могут пузыриться до него, которые запускались на элементах, которые соответствуют данному селектору. Первый может быть переписан как $("#container").delegate("a","click",function()... для той же функции. В большинстве случаев он намного эффективнее, чем привязка событий непосредственно к элементам. Однако, если ваш контент не является динамическим и не содержит очень много якорных тегов, вы должны использовать второй фрагмент кода, потому что он менее сложный, чем первый.

+0

Спасибо. Я все еще немного смущен. Как каждый из них полезен в реальных примерах жизни. – Pinkie

+0

Добавлено ответ на комментарий к моему ответу –

+0

Спасибо за разъяснения. Я имею дело с динамическим контентом. Поэтому первый селектор, кажется, является ответом. Является ли первый селектор отличным от '$ ('# container'). Find ('a'). On ('click', function() '.. – Pinkie

3
  1. Фрагмент кода 1:

    Установить событие щелчка, чтобы все теги привязки, которые находятся или будут находиться в #container

  2. фрагмент кода 2:

    Установить событие нажмите на все анкера теги в категории #container

1

бывший прикрепляет обработчик кликов к элементу #container, который назначает событие, если щелчок фокусируется на элементе a. Это особенно полезно, если элементы a могут быть обновлены, удалены или добавлены динамически после назначения/привязки обработчиков событий.

Последний прикрепляет обработчик кликов непосредственно к элементам a, содержащимся в элементе #container. Это означает, что те элементы должны присутствовать в DOM в то время, когда обработчики событий и функции привязаны к узлам в DOM.

0

Проверить jQuery docs

selector 
A selector string to filter the descendants of the selected elements that 
trigger the event. If the selector is null or omitted, the event is always 
triggered when it reaches the selected element. 
0

Я предполагаю, что «а» строка Селектор для фильтрации потомков отдельных элементов, которые вызывают событие. Если селектор имеет значение null или опущен, событие всегда срабатывает, когда оно достигает выбранного элемента.