triggerHandler 메서드
triggerHandler 메서드를 사용하면
요소에 연결된 모든 이벤트 핸들러를 실행할 수 있습니다. 이 메서드는
trigger 메서드와
유사하게 작동하지만, 다음과 같은 차이점이 있습니다:
이벤트 핸들러는 실행되지만 표준
이벤트는 발생하지 않습니다. 예를 들어
triggerHandler('submit')을(를) 실행하면,
submit 이벤트가 발생하지 않습니다.
triggerHandler 메서드는
세트의 첫 번째 요소에만 작동합니다.
triggerHandler로 실행된 이벤트는
DOM 요소 계층 구조에서 버블링되지 않습니다.
triggerHandler는 jQuery 객체를 반환하지 않으며,
마지막으로 호출된 핸들러에서 얻은 값을 반환합니다. 실행된 핸들러가 없으면
undefined를 반환합니다.
구문
첫 번째 매개변수로는 문자열 형태의 이벤트 유형을 전달할 수 있으며, 두 번째 선택적 매개변수로는 핸들러에 전달할 추가 매개변수를 포함하는 배열이나 객체를 전달할 수 있습니다:
$(selector).triggerHandler(eventType, [additionalParameters]);
첫 번째 매개변수로 jQuery.Event 객체 형태의 이벤트를
전달할 수도 있습니다:
$(selector).trigger(event, [additionalParameters]);
예제
#test1 버튼을 클릭했을 때
인풋 필드에 포커스가 가고
콘솔에 'Focused'가 출력되도록, 즉
핸들러 함수와 포커스 이벤트가 모두 실행되도록 해봅시다.
#test2 두 번째 버튼을 클릭하면
핸들러 함수만 실행되고
인풋 필드에는 포커스가 가지 않도록 해봅시다:
<button id="test1">button1</button>
<button id="test2">button2</button>
<input type="text">
$('#test1').click(function() {
$('input').trigger('focus');
});
$('#test2').click(function() {
$('input').triggerHandler('focus');
});
$('input').focus(function() {
console.log('Focused')
});
