Как отключить "зависание" в jQuery?
Это не работает:
$(this).unbind('hover');
Как отключить "зависание" в jQuery?
Это не работает:
$(this).unbind('hover');
$(this).unbind('mouseenter').unbind('mouseleave')
или более лаконично (спасибо @Chad Grant):
$(this).unbind('mouseenter mouseleave')
Собственно, jQuery documentation имеет более простой подход, чем приведенные выше примеры (хотя они будут работать очень хорошо):
$("#myElement").unbind('mouseenter mouseleave');
Как и в jQuery 1.7, вы также можете использовать $.on()
и $.off()
для привязки события, поэтому, чтобы отменить событие зависания, вы должны использовать более простой и более аккуратный:
$('#myElement').off('hover');
Псевдо-событие-имя "hover" используется как сокращенное обозначение для "mouseenter mouseleave", но в предыдущих версиях jQuery было обработано по-разному; требуя, чтобы вы явно удалили каждое из буквенных имен событий. Использование $.off()
теперь позволяет вам удалять оба события мыши с использованием той же стенографии.
Изменить 2016:
Еще один популярный вопрос, поэтому стоит обратить внимание на @Dennis98 в комментариях ниже, что в jQuery 1.9+ событие "hover" было устарел в пользу стандартных вызовов "mouseenter mouseleave". Итак, ваше объявление привязки событий должно выглядеть следующим образом:
$('#myElement').off('mouseenter mouseleave');
Отключить события mouseenter
и mouseleave
индивидуально или отменить все события на элементе (-ах).
$(this).unbind('mouseenter').unbind('mouseleave');
или
$(this).unbind(); // assuming you have no other handlers you want to keep
unbind() не работает с жестко закодированными встроенными событиями.
Итак, например, если вы хотите отменить событие mouseover из
<div id="some_div" onmouseover="do_something();">
, я обнаружил, что $('#some_div').attr('onmouseover','')
- быстрый и грязный способ его достижения.
Другим решением является .die() для событий, которые связаны с .live().
Пример:.
// attach click event for <a> tags
$('a').live('click', function(){});
// deattach click event from <a> tags
$('a').die('click');
Здесь вы можете найти хорошую референтность: Изучение jQuery.live() и .die()
(Извините за мой английский:" > )
Все зависания, выполняемые за кулисами, являются обязательными для свойства mouseover и mouseout. Я бы привязал и отвязал ваши функции от этих событий индивидуально.
Например, скажем, у вас есть следующий html:
<a href="#" class="myLink">Link</a>
то ваш jQuery будет:
$(document).ready(function() {
function mouseOver()
{
$(this).css('color', 'red');
}
function mouseOut()
{
$(this).css('color', 'blue');
}
// either of these might work
$('.myLink').hover(mouseOver, mouseOut);
$('.myLink').mouseover(mouseOver).mouseout(mouseOut);
// otherwise use this
$('.myLink').bind('mouseover', mouseOver).bind('mouseout', mouseOut);
// then to unbind
$('.myLink').click(function(e) {
e.preventDefault();
$('.myLink').unbind('mouseover', mouseOver).unbind('mouseout', mouseOut);
});
});
Я нашел, что это работает как второй аргумент (функция) в .hover()
$('#yourId').hover(
function(){
// Your code goes here
},
function(){
$(this).unbind()
}
});
Первая функция (аргумент для .hover()) - это mouseover и будет выполнять ваш код. Второй аргумент - mouseout, который отменит событие hover от #yourId. Ваш код будет выполнен только один раз.
Вы можете удалить специальный обработчик событий, который был прикреплен on
, используя off
$("#ID").on ("eventName", additionalCss, handlerFunction);
// to remove the specific handler
$("#ID").off ("eventName", additionalCss, handlerFunction);
Используя это, вы удалите только handlerFunction
Другая хорошая практика - установить имяSpace для нескольких присоединенных событий
$("#ID").on ("eventName1.nameSpace", additionalCss, handlerFunction1);
$("#ID").on ("eventName2.nameSpace", additionalCss, handlerFunction2);
// ...
$("#ID").on ("eventNameN.nameSpace", additionalCss, handlerFunctionN);
// and to remove handlerFunction from 1 to N, just use this
$("#ID").off(".nameSpace");