Как мне отменить привязку "hover" в jQuery?



Как мне отменить привязку "hover" в jQuery?



Это не работает:



$(this).unbind('hover');
508   8  

8 ответов:

$(this).unbind('mouseenter').unbind('mouseleave')

или более кратко (спасибо @Chad Grant):

$(this).unbind('mouseenter mouseleave')

на самом деле документация jQuery имеет более простой подход, чем цепные примеры, показанные выше (хотя они будут работать просто отлично):

$("#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','') это быстрый и грязный способ его достижения.

другое решение -.умри () для событий кто что прикрепил с .live ().

Ex.:

// attach click event for <a> tags
$('a').live('click', function(){});

// deattach click event from <a> tags
$('a').die('click');

здесь вы можете найти хороший ответ:изучение jQuery .жить и. умри ()

( извините за мой английский :"> )

все наведение делает за кулисами привязка к свойству 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);
  });

});

вы можете удалить определенный обработчик событий, который был прикреплен on, используя off

$("#ID").on ("eventName", additionalCss, handlerFunction);

// to remove the specific handler
$("#ID").off ("eventName", additionalCss, handlerFunction);

используя это, вы удалите только handlerFunction
Другой хорошей практикой является установка пространства имен для нескольких вложенных событий

$("#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");

Я обнаружил, что это работает как второй аргумент (функция).при наведении()

$('#yourId').hover(
    function(){
        // Your code goes here
    },
    function(){
        $(this).unbind()
    }
});

первая функция (аргумент .hover ()) - это наведение курсора мыши и выполнение вашего кода. Второй аргумент-mouseout, который отменит событие hover из #yourId. Ваш код будет выполнен только один раз.

Comments

    Ничего не найдено.