Jquery에서 호버 이벤트를 취소하는 방법

jquery에서 호버 이벤트를 취소하는 방법: 1. 클릭 및 호버 이벤트를 a 태그에 바인딩합니다. 2. "$('a').unbind('mouseenter').unbind('mouseleave'); " 취소 방법 호버 이벤트를 바인딩하기만 하면 됩니다.

이 문서의 운영 환경: windows7 시스템, jquery 버전 3.2.1, DELL G3 컴퓨터

jquery에서 호버 이벤트를 취소하는 방법은 무엇입니까?

호버를 취소하고 바인딩하는 올바른 방법 웹 페이지의 jquery

이벤트 디자인에서는 jquery를 사용하여 마우스 호버 이벤트에 응답하는 경우가 많습니다. 이는 mouseover 및 mouseout 이벤트와 동일한 효과가 있지만, 호버 메서드를 바인딩하기 위해 바인딩을 사용하는 방법은 무엇입니까? 바인딩 해제를 사용하여 이벤트 바인딩을 해제하는 방법은 무엇입니까?

1. 호버 이벤트 바인딩 방법

먼저 다음 코드를 살펴보세요. 클릭 및 호버 이벤트를 a 태그에 바인딩한다고 가정해 보겠습니다.

$(document).ready(function(){ $('a').bind({ hover: function(e) { //
Hover event handler alert("hover"); }, click: function(e) { // Click
event handler alert("click"); } }); });

a 태그를 클릭하면 이상한 일이 발생합니다. 바인딩 호버 이벤트는 전혀 응답하지 않지만 바인딩된 클릭 이벤트는 정상적으로 응답합니다.

하지만 다음과 같이 다른 방식으로 작성하면

$("a").hover(function(){ alert('mouseover'); }, function(){
alert('mouseout'); })

이 코드는 정상적으로 실행될 수 있습니다. 바인드 호버를 바인딩할 수 없나요?

사실 아니요, 대신 mouseenter와 mouseleave 두 이벤트를 사용해야 합니다(이것은 .hover() 함수에서도 사용되는 이벤트이기도 합니다)

따라서 다음과 같이 직접 인용할 수 있습니다.

$(document).ready(function(){ $('a').bind({ mouseenter: function(e) { //
Hover event handler alert("mouseover"); }, mouseleave: function(e) { //
Hover event handler alert("mouseout"); }, click: function(e) { // Click
event handler alert("click"); } }); });

Because .hover( )입니다. jQuery 자체에서 정의한 이벤트는 사용자가 mouseenter 및 mouseleave 이벤트를 바인딩하고 호출할 수 있도록 하기 위한 것입니다. 실제 이벤트가 아니므로 .bind()에서 이벤트 매개변수로 호출할 수는 없습니다.

2. hover 이벤트를 취소하는 방법

unbind 기능을 사용하여 바인딩된 이벤트만 취소할 수 있다는 것은 누구나 알고 있지만 jquery의 hover 이벤트는 매우 특별합니다. 이러한 방식으로 바인딩된 이벤트는 취소할 수 없습니다.

$("a").hover(function(){ alert('mouseover'); }, function(){
alert('mouseout'); })

바운드 hover 이벤트를 취소하는 올바른 방법:

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

3. 요약

사실 이러한 문제에 대해서는 jquery 공식 문서를 참조할 수 있지만 인터넷에서 대부분의 튜토리얼을 읽은 사람은 거의 없습니다. 그냥 이 방법을 어떻게 사용하는지 설명하는 것은 목표가 달성되어야 끝나는 것이지 왜 이렇게 작성했는지에 대한 심층적인 이해가 없습니까?

추천 학습: "jquery 비디오 튜토리얼"

위 내용은 Jquery에서 호버 이벤트를 취소하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!