Какой лучший способ прикрепить события Javascript к списку результатов поиска, загруженных AJAX?

Question

У меня есть страница поиска, которая загружает результаты. Рядом с каждой строкой есть кнопка «Удалить», с помощью которой я хочу запустить определенную функцию Javascript на своей странице, используя некоторые параметры, характерные для этой строки.

Лучше ли помещать вызов функции непосредственно в генерируемый HTML, например onclick="deleteFunc(<params from results array>);" или я должен вместо этого прикрепить события jQuery click? Я предпочел последнее, но в этом случае я не уверен, что лучший способ сделать это.

Можно ли каким-то образом прикрепить события к какому-либо HTML, даже если он еще не добавлен на страницу? Если нет, то мне придется добавить все результаты на страницу, включая индекс массива каждой строки из результатов поиска, а затем прикрепить событие click к кнопке при доступе к параметрам этой строки из исходного массива с помощью индекса. Я храню в скрытом поле HTML. Это похоже на большую работу по повторной корреляции всего, когда есть момент, когда я создаю HTML, где у меня есть все параметры, которые нужны для кнопки удаления конкретной строки.

Если я использую события jQuery click, есть ли опасность нехватки памяти? Я могу вернуть тысячу строк. Если так, что происходит, когда у него заканчивается память?

Другим вариантом будет сериализация JSON каждой строки массива в скрытое поле рядом с кнопкой удаления, которое я затем смогу получить позже. Похоже, что это было бы более эффективным для памяти, но также кажется уродливым.

Answer 1

Думаю, метод JQuery .live () может работать на вас.

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

Answer 2

Вы можете добавлять события в динамически добавленные элементы, используя метод .live().

$('.element').live('click', function() {
  // do some stuff.
});

Answer 3

Да, вы можете прикреплять события к элементам HTML, даже если они существуют, используя live метод

$('.selector').live('click',function(){

alert('Do something here!');

});