jQuery 트리거 클릭

오늘의 포스트는 jQuery의 trigger 클릭 이벤트에 대해 가르칠 것입니다.

jQuery에서 클릭 이벤트 트리거

jQuery는 지정된 이벤트 유형에 대해 일치하는 항목에 연결된 모든 핸들러 및 동작을 실행하는 trigger 메서드를 제공합니다.

통사론:

.trigger(eventType[, extraParameters])

1. eventType은 클릭 또는 제출과 같은 JavaScript 이벤트 유형을 포함하는 문자열입니다.
2. extraParameters는 이벤트 핸들러에 전달할 추가 매개변수입니다.

.on() 또는 바로 가기 기술 중 하나와 관련된 이벤트 핸들러는 해당 이벤트가 발생하는 동안 침전됩니다. 그러나 .trigger() 메서드를 사용하여 수동으로 트리거할 수 있습니다.

.trigger()에 대한 호출은 이벤트가 사용자를 통해 확실히 트리거된 경우와 동일한 순서로 핸들러를 실행합니다.

jQuery 1.3부터 ​​.trigger() 이벤트는 DOM 트리에 나타납니다. 이벤트 핸들러는 핸들러에서 false를 반환하거나 이벤트에 초과된 이벤트 객체에 대해 .stopPropagation() 접근 방식을 호출하여 버블링을 방지할 수 있습니다. 합성된 이벤트 객체로 전체 이벤트 활성화를 시뮬레이션하는 .trigger()에도 불구하고 이제 확실히 진행 중인 이벤트를 완벽하게 복제하지 않습니다.

이벤트 객체는 이벤트 핸들러의 첫 번째 매개변수로 지속적으로 전달됩니다. 인수 배열도 .trigger() 호출에 전달할 수 있으며 해당 매개변수는 이벤트 객체를 적절하게 따라가기 때문에 핸들러를 따라 초과될 수 있습니다.

jQuery 1.6.2부터 단일 문자열 또는 숫자 인수를 배열로 묶지 않고 전달할 수 있습니다.

.trigger() 기술은 Pub/Sub 메커니즘과 유사한 간단한 JavaScript 객체를 래핑하는 jQuery 컬렉션에서 사용할 수 있습니다. 이벤트가 발생할 때 개체에 대해 주어진 이벤트 핸들러를 호출할 수 있습니다.

다음 예를 통해 이해해 봅시다.

<a onclick="doSomething()">Google</a>
<button type="button" id="trigger-btn">Trigger</button>

$('#trigger-btn').click(function() {
  console.log('triggering')
  $('a').trigger('click');
});

function doSomething() {
  alert('Click event is triggered on the link.');
}

위의 예에서는 사용자에게 알리는 click 기능을 정의했습니다. 특정 링크와 함께 href 속성을 전달할 수 있습니다.

다른 요소가 이 클릭을 트리거해야 하는 예를 들어보겠습니다. 이 예에서는 click을 트리거하는 trigger 버튼을 정의했습니다.

jQuery를 지원하는 모든 브라우저에서 위의 코드 조각을 실행해 보십시오. 아래에 결과가 표시됩니다.

출력:

데모