まず、テキストボックスがfocusを受け取った際に”Focused!”と表示するようにイベントハンドラを登録します。
次に2種類のボタンを用意しますが、片方はtrigger関数を呼び出すのでクリックと同時にテキストボックスにフォーカスが移ります。
一方、triggerHandlerを呼び出すボタンは、コールバック関数が呼び出されるので”Focused!”と表示はされますが、実際にはブラウザの動作は行われずフォーカスは設定されません。
Events/API/jQuery
triggerHandler(type, [data])
各要素の指定されたイベントにひもづけられた、コールバック関数のみを実行します。
trigger関数との違いは、ブラウザのデフォルトの動作を行わない点だけです。
trigger関数との違いは、ブラウザのデフォルトの動作を行わない点だけです。
サンプル
サンプル1
<button id="old">.trigger("focus")</button>
<button id="new">.triggerHandler("focus")</button><br/><br/>
<input type="text" value="To Be Focused"/>
$("#old").click(function(){
$("input").trigger("focus");
});
$("#new").click(function(){
$("input").triggerHandler("focus");
});
$("input").focus(function(){
$("<span>Focused!</span>").appendTo("body").fadeOut(1000);
});
[全コードを表示]
[実行結果を単体で表示]