Скрипты jQuery больше не работают на частично обновленных элементах

Question

У меня есть несколько jQuery-скриптов, которые выбирают элементы в области, на которой я запускаю частичное обновление страницы.

Я использую этот фрагмент кода css tricks для обновления этой части страницы:

$('#refreshbutton').click(function() {

 var url = "http://myUrl.com/indexTest.php?ID=" + Math.random(); 

 setTimeout(function() {
        $("#maindisplay").load(url+" #maindisplay>*","");
 }, 100); 
});

Проблема в том, что элементы в #maindisplay изменены, поэтому они считаются новыми элементами в dom. Поскольку сценарии, которые выбирают эти элементы и прикрепляют к ним функции, выполняются не сразу, а во время частичного обновления, это создает проблему.

До сих пор я не смог найти способ присоединить сценарии к элементам в #maindisplay после того, как я частично обновлю его.

Мой вопрос: каков оптимальный способ присоединения сценариев к обновленной области страницы.

Спасибо за любой совет.

Answer 1

Вам необходимо использовать функцию live(), чтобы прикрепить обработчик кликов.

Answer 2

У меня есть следующие варианты, о которых я могу подумать:

• Поместить вложение в функцию и вызвать эту функцию при обновлении страницы
• Использовать функцию .live ()
• Использование функциональности .delegate ()
• Поместить ссылку Javascript на функциональность в ссылке в обновлении, чтобы она выполнялась как часть этого обновления
• Поместите функцию вобратный вызов
• делает его частью вашего setTimeout
• какого-то другого творческого метода, о котором я не думал ...

Просто примечание: я бы посмотрел на.delegate () с контекстным выбором, добавленным в последних версиях (например, доступно в 1.4.2).

Answer 3

Не выполняет ли load () функцию обратного вызова в качестве второго аргумента?Почему бы не присоединить обработчики событий к элементам с этой функцией?

$('#result').load('ajax/test.html', function() {
  //reattach event handlers here.
});