ホームページ > 記事 > ウェブフロントエンド > JQuery は、簡単な例を通じて、trigger() とtriggerHandler() の違いを比較します。
JQuery は、簡単な例を通じて、trigger() とtriggerHandler() の違いを比較します。
- 巴扎黑オリジナル
- 2017-06-25 13:31:341325ブラウズ
Web ページの特殊効果を作成する場合、シミュレーション操作、つまり手動操作をシミュレートする必要がある場合があります。このとき、JQueryの2つのシミュレーション操作メソッドtrigger()とtriggerHandler()を考えます。これら 2 つの方法はどちらも手動操作を簡単にシミュレートできますが、両者の違いは何でしょうか?以下では、簡単なケースを通してそれらの違いを紹介します。このケースの効果: ページを更新すると、 ボタン をクリックした場合の効果が自動的にシミュレートされ、プロンプトが表示されます。
まず、新しいページを作成し、次の 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 つのボタンをクリックします。そのうちの 1 つは http://wanlimm.com ページを取得します。
次に、4ec11beb6c39d0703d1751d203c170532cacc6d41bbb37262a98f745aa00fbf0 の間に JS コードを追加します。
$(function(){
$(":submit").click(function(e){
alert($(this).val());
}).trigger('click');
});ここで使用するトリガー メソッドは、ポップアップ ウィンドウの表示を 2 回更新します。 " と bbb" をそれぞれ入力し、フォーム動作を使用して http://wanlimm.com ページに自動的にジャンプします。
trigger をtriggerHandler に置き換えると、ポップアップ ウィンドウが 1 つだけになり、フォームの動作がブロックされ、http://wanlimm.com ページに自動的にジャンプしなくなります。
次に、次のように HTML コード内の青いフォーム コードを削除し、CSS メソッドを JS コードに追加します。
$(function(){
$(":submit").click(function(e){
alert($(this).val());
}).trigger('click').css('color','red');
});ページを更新すると、2 つのポップアップの後、ボタン内のテキストが次のようになります。赤。ただし、トリガーがtriggerHandlerに変更された場合、ページを更新した後、ウィンドウは1回だけポップアップし、テキストは赤くなりません。
trigger とtriggerHandler の違いを要約すると、次のようになります。
1.triggerHandler() メソッドはイベントのデフォルトの動作をトリガーしませんが、trigger() はトリガーします。
2.triggerHandler() メソッドは最初に一致した要素にのみ影響しますが、.trigger() はすべての要素に影響します。
3. TriggerHandler() メソッドは、オブジェクトではなく、現在のイベント実行の戻り値を返すため、他のメソッドに接続できません。イベントトリガー要素が含まれています。
4. イベントの作成時にtriggerHandler()はバブルしません。 trigger() はバブルしますが、この種のバブルはカスタム イベントによってのみ反映されます。
以上がJQuery は、簡単な例を通じて、trigger() とtriggerHandler() の違いを比較します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。