jQuery: Единственный щелчок кнопки, щелкните по событию, стреляющему два или больше раза
Мне вводили HTML и элементы кнопки. Я использую кнопки, чтобы представить формы, открыть вторичные окна, и т.д. Проблема, единственный щелчок превращается 2 (и иногда намного больше) подчинение формы или открывает два дополнительных окна браузера. Я воспроизвел проблему в нескольких веб-браузерах. Я попытался переключить версии jQuery, и это ничего не изменило. Что могло вызывать этот вид вещи произойти?
3 ответа
Ваша проблема может происходить, потому что вы назначаете тот же обработчик в событие Click несколько раз. Предлагаю вам проверить, что линия, где вы назначаете обработчик, не называется несколько раз непреднамеренно. Другое решение может быть вызовом на UnvInd (устарело 3.0) или от (сверхугольника):
$("#myButton").unbind("click").click(myHandler); // deprecated
$("#myButton").off("click").click(myHandler); // superseeded
, но не видя некоторых кода, я просто догадаю.
Учитывая, что вы не предоставили много информации, лучшее, что я могу порекомендовать, это посмотреть на one()
jQuery Sparkle предоставляет чистое элегантное решение для этого, вызывая функцию "once", вы можете привязать обработчик к событию только один раз.
Это важное улучшение по сравнению с предложением Darko Z, поскольку использование:
$("#myButton").unbind("click").click(myHandler);
Отвяжет любые другие обработчики "click", связанные с событием "click" при каждом вызове. Таким образом, вы обеспечиваете привязку только один раз, но при этом случайно отвязываете все остальные! Упс!
Предложение Джарретта отвязывает обработчик "click" сразу после его вызова, так что если вы хотите, чтобы обработчик был вызван снова (после его первоначального срабатывания), вам придется перепривязать обработчик.
Использование jQuery Sparkle's once позволит обработчику срабатывать столько раз, сколько нужно, но привязка будет осуществляться только один раз, а не несколько. Вы можете использовать его следующим образом:
$('#myButton').once('click', function(){
// my handler
});
Или, если вы хотите поддерживать данные в обратном вызове, как во встроенном в jQuery "bind", то вы можете использовать:
$('#myButton').once('click', data, function(){
// my handler
});
Вы можете найти исходный код для определения функции once здесь.
Это открытый исходный код под лицензией AGPL, так что вы можете смело брать из него все, что вам нужно! :-) Он также активно развивается изо дня в день, так что вы никогда не будете испытывать недостатка в поддержке.
Но самое главное - это DRY Plugin/Effect Framework, который позволит вам разрабатывать плагины и расширения намного проще. Надеюсь, это поможет вам достичь этой цели!