jQuery에서 "hover"의 바인딩을 해제하려면 어떻게 해야 합니까?

jQuery에서 "hover"의 바인딩을 해제하려면 어떻게 해야 합니까?

jQuery에서 "hover"의 바인딩을 해제하려면 어떻게 해야 합니까?

작동하지 않습니다.

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

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

또는 좀 더 간결하게 (감사합니다 @Chad Grant):

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

실제로 jQuery 문서는 위에 표시된 연쇄 예제보다 더 간단한 접근 방식을 가지고 있습니다(단, 잘 작동합니다).

$("#myElement").unbind('mouseenter mouseleave');

jQuery 1.7부터는 이벤트 바인딩을 사용할 수도 있고 이벤트 바인딩도 사용할 수 있으므로 호버 이벤트의 바인딩을 해제하려면 보다 단순하고 깔끔합니다.

$('#myElement').off('hover');

유사 이벤트 이름 "hover"는 "mouseenter mouse leave"의 축약어로 사용되지만, 이전 jQuery 버전에서는 다르게 처리되었으며, 각 리터럴 이벤트 이름을 명시적으로 제거해야 합니다.사용.$.off()이제 동일한 속기를 사용하여 두 마우스 이벤트를 모두 삭제할 수 있습니다.

2016 편집:

여전히 인기 있는 질문이므로 아래 댓글에서 @Dennis98이 jQuery 1.9+에서 "후버" 이벤트가 표준 "마우스 엔터 마우스 탈퇴" 호출을 선호하여 더 이상 사용되지 않는다는 점에 주목할 필요가 있습니다.이제 이벤트 바인딩 선언은 다음과 같이 표시됩니다.

$('#myElement').off('mouseenter mouseleave');

언바인드 더mouseenter그리고.mouseleave이벤트를 개별적으로 실행하거나 요소의 모든 이벤트를 바인딩 해제합니다.

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

아니면

$(this).unbind();  // assuming you have no other handlers you want to keep

unbind()는 하드코딩된 인라인 이벤트에서는 작동하지 않습니다.

예를 들어, 마우스 오버 이벤트의 바인딩을 해제하려면<div id="some_div" onmouseover="do_something();">, 발견했습니다.$('#some_div').attr('onmouseover','')그것을 달성하기 위한 빠르고 더러운 방법입니다.

또 다른 솔루션은 .live()로 첨부된 이벤트의 .die()입니다.

예:

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

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

여기서 좋은 참고 자료를 찾을 수 있습니다: jQuery .live() and .die() 탐색

(영어 미안해요 :">)

뒤에서 수행하는 모든 호버는 마우스 오버 및 마우스 아웃 속성에 바인딩됩니다.저는 당신의 기능을 개별적으로 결합하고 해제할 것입니다.

예를 들어 다음과 같은 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);

이를 사용하면 핸들러 기능만 제거됩니다.
또 다른 좋은 방법은 여러 개의 첨부된 이벤트에 nameSpace를 설정하는 것입니다.

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

나는 이것이 .hover()에 대한 두 번째 인수(함수)로 작동한다는 것을 발견했습니다.

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

첫 번째 함수(.hover() 인수)는 마우스 오버이며 코드를 실행합니다.두 번째 인수는 #yourId에서 호버 이벤트를 바인딩 해제하는 마우스 아웃입니다.코드는 한 번만 실행됩니다.

언급URL : https://stackoverflow.com/questions/805133/how-do-i-unbind-hover-in-jquery