>웹 프론트엔드 >JS 튜토리얼 >jQuery를 사용하여 요소에 바인딩된 이벤트 리스너 목록을 어떻게 검색할 수 있나요?

jQuery를 사용하여 요소에 바인딩된 이벤트 리스너 목록을 어떻게 검색할 수 있나요?

Linda Hamilton
Linda Hamilton원래의
2024-11-08 02:52:02419검색

How can I retrieve a list of event listeners bound to an element using jQuery?

jQuery를 사용하여 요소에 할당된 이벤트 리스너 검색

JavaScript에서 요소에 이벤트 핸들러를 연결하는 것은 사용자 상호 작용을 향상시키기 위한 일반적인 방법입니다. jQuery는 강력한 이벤트 처리 기능을 제공하므로 요소에 대한 이벤트 리스너를 쉽게 할당하고 관리할 수 있습니다. 이는 질문을 제기합니다. jQuery를 사용하여 특정 요소에 바인딩된 이벤트 목록을 검색할 수 있습니까?

문제:

시나리오: ID가 "인 요소가 있습니다. elm"을 사용하고 이 링크에 두 개의 이벤트 핸들러를 연결했습니다. 하나는 클릭 이벤트용이고 다른 하나는 마우스 오버용입니다. event.

<a href='#'>
$(function()
{
  $('#elm').click(_f);
  $('#elm').mouseover(_m);
});

function _f(){alert('clicked');}
function _m(){alert('mouse over');}

ID가 "elm"인 요소와 연결된 모든 이벤트 목록을 얻을 수 있는 방법이 있습니까?

답변:

최신 버전의 jQuery에서는 $._data 메소드를 사용하여 요소에 바인딩된 이벤트를 포함하여 요소에 대한 정보를 검색할 수 있습니다. $._data는 내부 전용 메서드라는 점은 주목할 가치가 있습니다.

// Bind up a couple of event handlers
$("#foo").on({
    click: function(){ alert("Hello") },
    mouseout: function(){ alert("World") }
});

// Lookup events for this particular Element
$._data( $("#foo")[0], "events" );

$._data는 지정된 요소에 연결된 이벤트가 포함된 개체를 반환합니다.

{ 
    click: [
        {
            handler: function(){ alert("Hello") }  // The defined click handler
        } 
    ],
    mouseout: [
        {
            handler: function(){ alert("World") }  // The defined mouseout handler
        }
    ] 
}

In Chrome에서는 핸들러 함수를 마우스 오른쪽 버튼으로 클릭하고 "함수 정의 보기"를 선택하여 코드에서 해당 함수의 출처를 추적할 수 있습니다.

위 내용은 jQuery를 사용하여 요소에 바인딩된 이벤트 리스너 목록을 어떻게 검색할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.