>  기사  >  웹 프론트엔드  >  JQuery는 클릭 이벤트를 시뮬레이션하고 이벤트를 자동으로 트리거합니다.

JQuery는 클릭 이벤트를 시뮬레이션하고 이벤트를 자동으로 트리거합니다.

小云云
小云云원래의
2017-11-17 11:51:1638842검색

때때로 클릭 효과를 얻으려면 사용자 작업을 시뮬레이션해야 합니다. 예를 들어, 사용자가 페이지에 들어간 후 사용자가 직접 클릭하지 않아도 클릭 이벤트가 트리거됩니다. JQuery에서는 Trigger() 메서드를 사용하여 시뮬레이션 작업을 완료할 수 있습니다. 예를 들어, 다음 코드를 사용하여 ID가 ​​btn인 버튼의 클릭 이벤트를 트리거할 수 있습니다. 이 기사에서는 JQuery가 클릭 이벤트를 시뮬레이션하고 이벤트를 자동으로 트리거하는 방법을 설명합니다.

 $('#btn').trigger("click");

이렇게 하면 페이지가 로드되면 원하는 효과가 즉시 출력됩니다. click()을 직접 단축하여 동일한 효과를 얻을 수도 있습니다.

$('#btn').click();

Trigger custom events

trigger() 메서드는 브라우저에서 지원하는 동일한 이름의 이벤트를 트리거할 수 있을 뿐만 아니라 사용자 정의 이름의 이벤트도 트리거할 수 있습니다. 예를 들어 "myClick" 이벤트를 요소에 바인딩하려면 JQuery 코드는 다음과 같습니다.

  $('#btn').bind("myClick", function(){      
 $(&#39;#test&#39;).append("<p>我的自定义事件.</p>");      
 });

이 이벤트를 트리거하려면 다음 코드를 사용하여 이를 달성할 수 있습니다.

$(&#39;#btn&#39;).trigger("myClick");

데이터 전달

trigger (type[, data]) 메소드에는 두 개의 메소드 매개변수가 있는데, 첫 번째 매개변수는 트리거할 이벤트 유형이고, 두 번째 매개변수는 이벤트 처리 함수에 전달할 추가 데이터로 배열 형태로 전달됩니다. 일반적으로 콜백 함수에 매개변수를 전달하여 이벤트가 코드에 의해 트리거되는지 아니면 사용자에 의해 트리거되는지 구별할 수 있습니다.

다음은 데이터 전달 예시입니다.

$(function(){      
$(&#39;#btn&#39;).bind("myClick", function(event, message1, message2){      
$(&#39;#test&#39;).append( "<p>"+message1 + message2 +"</p>");      
 });      
 $(&#39;#btn&#39;).click(function(){      
 $(this).trigger("myClick",["我的自定义","事件"]);      
}).trigger("myClick",["我的自定义","事件"]);      
 })

기본 작업 수행

trigger() 메서드가 이벤트를 트리거한 후 브라우저 기본 작업이 수행됩니다. 예:

 $("input").trigger("focus");

위 코드는 d5fd7aea971a85678ba271703566ebfd 요소에 바인딩된 포커스 이벤트를 트리거할 뿐만 아니라 d5fd7aea971a85678ba271703566ebfd 요소 자체도 포커스를 얻도록 합니다(이것이 브라우저의 기본 작업입니다).

브라우저의 기본 작업을 수행하지 않고 바인딩된 포커스 이벤트만 실행하려는 경우 jQuery에서 또 다른 유사한 메서드인 TriggerHandler() 메서드를 사용할 수 있습니다.

$("input").triggerHandler("focus");

이 메서드는 d5fd7aea971a85678ba271703566ebfd 요소에 바인딩된 특정 이벤트를 트리거하는 동시에 이 이벤트에 대한 브라우저의 기본 작업을 취소합니다. 즉, 텍스트 상자는 바인딩된 포커스 이벤트만 트리거하고 수신하지 않습니다. 집중하다.

이 글에서는 주로 클릭 이벤트를 시뮬레이션하고 자동으로 이벤트를 트리거하는 JQuery를 소개합니다.

관련 권장 사항:

js는 클릭 이벤트를 시뮬레이션합니다

js는 클릭 이벤트 구현을 시뮬레이션합니다. code_javascript 기술

Javascript는 클릭 이벤트(클릭 링크 및 HTML 클릭)를 시뮬레이션합니다. IE/Firefox_javascript 기술과 호환됩니다

위 내용은 JQuery는 클릭 이벤트를 시뮬레이션하고 이벤트를 자동으로 트리거합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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