JQuery는 간단한 예를 통해 Trigger()와 TriggerHandler()의 차이점을 비교합니다.-JS 튜토리얼-php.cn

JQuery는 간단한 예를 통해 Trigger()와 TriggerHandler()의 차이점을 비교합니다.

巴扎黑

풀어 주다： 2017-06-25 13:31:34

원래의

1312명이 탐색했습니다.

웹페이지 특수 효과를 만들 때 때로는 시뮬레이션 작업, 즉 수동 작업을 시뮬레이션해야 하는 경우가 있습니다. 이때 JQuery의 두 가지 시뮬레이션 연산 방식인 Trigger()와 TriggerHandler()를 생각해 보겠습니다. 이 두 가지 방법 모두 수동 작업을 쉽게 시뮬레이션할 수 있는데, 둘 사이의 차이점은 무엇입니까? 아래에서는 간단한 사례를 통해 차이점을 소개합니다. 페이지를 새로 고치면 버튼을 클릭하는 효과가 자동으로 시뮬레이션되고 프롬프트가 나타납니다.

먼저, 새 페이지를 만들고 다음 HTML 코드를 페이지에 추가하세요:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>无标题文档</title>
<style>
*{padding:0; margin:0;}
.hi{background:red;width:100px;height:100px; position:relative;}
</style>
<script type="text/javascript" src="/a/js/jquery-1.10.1.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<div class="hi">
<form action="http://wanlimm.com" >
<input type="submit" value="aaa" />
<input type="submit" value="bbb" />
</form>
</div>
</body>
</html>

로그인 후 복사

이 HTML 코드의 형식에는 2개의 버튼이 있고 해당 값은 "aaa"와 "bbb"입니다. 이제 이 2개의 버튼을 클릭하세요. 그 중 하나에 http://wanlimm.com 페이지가 표시됩니다.

그런 다음 사이에 JS 코드를 추가하세요.

$(function(){
$(":submit").click(function(e){
alert($(this).val());
}).trigger(&#39;click&#39;);
});

로그인 후 복사

여기서 우리가 사용하는 트리거 방법은 페이지를 두 번 새로 고치는 팝업 창에 " aaa" 및 "bbb"를 각각 입력한 다음 자동으로 양식 동작을 사용하여 자동으로 http://wanlimm.com 페이지로 이동합니다.

트리거를 TriggerHandler로 바꾸면 팝업창이 하나만 생기고 양식 동작이 차단되며 자동으로 http://wanlimm.com 페이지로 이동하지 않습니다.

그런 다음 HTML 코드에서 파란색 양식 코드를 제거한 다음 다음과 같이 CSS 메서드를 JS 코드에 추가합니다.

$(function(){
$(":submit").click(function(e){
alert($(this).val());
}).trigger(&#39;click&#39;).css(&#39;color&#39;,&#39;red&#39;);
});

로그인 후 복사

페이지를 새로 고칠 때 팝업이 2번 표시된 후 버튼의 텍스트는 다음과 같습니다. 빨간색. 그러나 트리거를 TriggerHandler로 변경하면 페이지 새로 고침 후 창이 한 번만 팝업되고 텍스트가 빨간색으로 바뀌지 않습니다.

trigger와 TriggerHandler의 차이점을 요약하면 다음과 같습니다.

1. TriggerHandler() 메서드는 이벤트의 기본 동작을 트리거하지 않지만 Trigger()는 트리거합니다.

2. TriggerHandler() 메서드는 일치하는 첫 번째 요소에만 영향을 미치는 반면, .trigger()는 모든 요소에 영향을 미칩니다.

3. TriggerHandler() 메서드는 현재 이벤트 실행의 반환 값을 반환하기 때문에 다른 메서드에 연결할 수 없습니다. Trigger() 메서드는 현재 이벤트 실행의 반환 값을 반환하기 때문에 다른 메서드에 연결할 수 없습니다. 이벤트 트리거 요소를 포함합니다.

4. 이벤트를 생성할 때 TriggerHandler()는 버블링되지 않습니다. Trigger()는 버블링되지만 이러한 종류의 버블링은 사용자 정의 이벤트에 의해서만 반영될 수 있습니다.

위 내용은 JQuery는 간단한 예를 통해 Trigger()와 TriggerHandler()의 차이점을 비교합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!