В jQuery есть ли способ привязать клик только один раз?

Question

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

Answer 1

Пользователь jQuery one функционирует, как сказал Том, но каждый раз перед привязыванием отвязывает обработчик. Это помогает назначить обработчик события переменной, чем использование анонимной функции.

 var handler = function(e) { // stuff };

 $('#element').unbind('click', handler).one('click', handler);

 //elsewhere
 $('#element').unbind('click', handler).one('click', handler);

Вы также можете сделать .unbind('click'), чтобы удалить все обработчики кликов, прикрепленные к элементу.

Answer 2

Вы можете прикрепить событие к document с помощью функции one():

$(document).one('click', function(e) {
    // initialization here
});

После запуска этот обработчик событий снова удаляется, чтобы он больше не запускался. Однако если вам нужна инициализация для запуска до события щелчка какого-либо другого элемента, нам придется подумать о другом. Тогда можно использовать mousedown вместо click, так как событие mousedown запускается до события click.

Answer 3

Вы также можете использовать .off (), если unbind не сработает. Убедитесь, что селектор и событие, заданные для .off, точно совпадают с теми, которые изначально были предоставлены для .on ():

$("div.selector").off("click", "a.another_selector");    
$("div.selector").on("click", "a.another_selector", function(e){

Это то, что помогло мне решить ту же проблему перезагрузки ajax.

Answer 4

Ответ от Четан Шастри - то, что вы хотите. По сути, просто вызовите $ (element) .unbind (event); перед каждым событием.

Так что если у вас есть функция типа loadAllButtonClicks (), которая содержит все

$(element).on("click", function (){}); 

методов для каждой кнопки на вашей странице, и вы запускаете это при каждом нажатии кнопки, это, очевидно, приведет к более чем одному событию для каждой кнопки. Чтобы решить эту проблему, просто добавьте

$(element).unbind(event);

перед каждым

$(element).on("click", function (){}); 

, и он отменит все события для этого элемента, а затем добавит событие в один клик.