Web notes

В jQuery 1.3 и выше добавлено метод live, который добавляет обработчик событий всем элементам и поддерживает такие события, как: click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, keydown, keypress и keyup.

Но, к сожалению, этот метод .live() плохо "дружит" с Ajax и не всегда работает корректно. По этому приходится использовать один замечательный плагин Live Query.

Преимущество Live Query в том, что он при обновлении дерева DOM автоматически связывает элементы с обработчиком событий и нормально работает с новыми DOM элементами, полученными через Ajax.

Подключается плагин как и все:

<script type="text/javascript" src="jquery.livequery.js"></script>

Использовать тоже не сложно.
Например, нам нужно получить value пункта в списке <OPTION> из контейнера <SELECT> с id=”myselect”, где сам список подгружается с помощью Ajax.

Делается это так:

$("#myselect").livequery(function(){
$(this).change(function() {
alert(this.value);
});
});

Или более изящней:

$("#myselect").livequery("change", function() {
alert(this.value);
});

В результате при выборе одного пункта из списка <SELECT> появится сообщение с его значением value.

Пример 2. При наведении курсора (mouseover) на элемент с id=”alert” вывести сообщение: "Получил курсор!". А после того, как уберем курсор (mouseout), вывести: "Потерял."

Решение:

$("#alert").livequery(function(){
$(this).hover(function() {
alert("Получил курсор!");
}, function() {
alert("Потерял.");
});
});

Так что если у вас не работает onchange в Internet Explorer (IE) или какие-то проблемы с элементами полученными через Ajax, пользуйтесь Live Query!

Посмотреть пример работы Live Query.

Скачать пример с плагинов Live Query.