jQuery datatables несколько вызовов обработчика событий с живой функцией

Я использую таблицы данных jQuery для отображения некоторых данных. В каждой строке есть кнопка редактирования, для которой я регистрирую обработчик кликов с помощью live(), чтобы он работал с нумерацией страниц. Я делаю это по классам, так как я должен делать это для каждой строки. Что-то вроде: Таблицы данных с функцией события живого клика

Это отлично работает, но проблема возникает, когда пользователь снова выполняет поиск, и я делаю запрос ajax для получения нового набора результатов.

Я просто заменяю существующую таблицу в доме на новую. Теперь, когда я нажимаю на строку 1, появляется диалоговое окно редактирования для строки 1. Я нажимаю на строку 2, появляется диалоговое окно редактирования для строки 1. Я снова нажимаю на строку 2, и на этот раз открывается диалоговое окно редактирования для строки 2.

Затем я снова и снова нажимаю на строку 3. Он трижды выводит диалоговое окно редактирования для строки 2, прежде чем отобразить диалоговое окно для строки 3.

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

В случае, если это имеет значение, в моем инициализаторе диалога для autoopen установлено значение false, и я явно открываю и закрываю его.

Изменить (подробнее):

Мне трудно создать пример ... но подробнее ... Я понял, что, поскольку я использую функцию live() для регистрации вызовов через разбиение на страницы, существует механизм регистрации кликов. Поэтому, когда я заменяю таблицу той же структурой, функция щелчка регистрируется из-за первого вызова live(). Но я делаю еще один вызов live() по умолчанию, и теперь регистрируются два события щелчка. Затем, когда я снова заменяю, регистрируются три щелчка события. Я попытался преодолеть это, зарегистрировав события с помощью jQuery click() после проверки, зарегистрировано ли уже событие клика. Помогает с частью нескольких событий, но не регистрирует события на страницах таблиц данных.


person Rohit Banga    schedule 06.10.2012    source источник
comment
я попытаюсь сделать автономный jsfiddle   -  person Rohit Banga    schedule 06.10.2012


Ответы (2)


У вас была эта проблема с live и ajax. В итоге я перерегистрировал клики событий после получения ответа ajax. Без примера трудно рекомендовать решение, но идея состоит в том, чтобы прикрепить события щелчка при загрузке страницы с помощью привязки/щелчка (для отображения по умолчанию/начального отображения), а затем повторно зарегистрировать события щелчка снова при успешном ответе ajax. Конечно, размещение кода привязки событий в повторно используемом компоненте, таком как функция, чтобы его можно было легко вызвать.

person Draghon    schedule 06.10.2012
comment
В моем случае это было бы слишком много работы, так как у меня есть регистрации событий в нескольких файлах. - person Rohit Banga; 06.10.2012

Исправлена ​​проблема

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

Использование live() для регистрации событий помогло, и при изменении страницы события будут регистрироваться автоматически.

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

Я пошел в другом направлении и попытался зарегистрировать события щелчка, используя .click() вместо .live() при изменении страницы, используя событие страницы (http://datatables.net/docs/DataTables/1.9.beta.1/#page_details). Это не помогло, поскольку события, связанные с изменением страницы, были вызваны до того, как содержимое было обновлено с помощью событий на новой странице.

Я также пытался использовать click() вместо live() и привязывать click только в том случае, если он еще не был зарегистрирован, используя приведенный здесь пример https://stackoverflow.com/a/6361507/161628. Этот метод работал при замене таблицы, но не на нескольких страницах.

В конце концов я нашел функцию .die(). Я вызываю его перед вызовом функции live(). Вызов live() гарантирует, что обработчики событий будут зарегистрированы при изменении страницы, а вызов die() гарантирует, что я отменю регистрацию событий live(), созданных ранее для элементов этого класса. Таким образом я избегаю множественных вызовов функции live().

person Rohit Banga    schedule 06.10.2012