)ver1.3〜機能jQueryオブジェクトで指定した要素に設定された、第1引数のイベント処理を実行しますします。第2引数に配列を設定すると、イベント発生時の処理(function)に引数を渡すことができます。triggerメソッドはブラウザ標準の処理も実行します。triggerHandlerメソッドを利用してください。v1.3から引数にイベントオブジェクトを利用できるようになりました。jQuery.Eventで紹介しています。解説イベント処理を実行サンプル(trigger/01.html)を開いてbody内にtextタイプのinput要素とbutton要素があることを確認してください。jQueryは以下の部分を最初に確認してください。valメソッドを利用して「フォーカスされたよ」とinput内に表示します。function(eo){$(this).val("フォーカスされたよ");});実際にinput要素を選択するとinput内に文字が表示されます。ここで確認しておくのがinput要素に枠が付いていることです(ブラウザによって演出が異なります、例えばmacのsafariでは青枠が付きます)。これは、現在どこが選択(フォーカス)されているか分かるようにする「ブラウザ標準の機能」です。続いてbuttonの処理を設定している以下の処理を確認して下さい。buttonをクリックすると、triggerメソッドを利用してinput要素に設定されたfocusのイベント処理を実行します。$("button").click(function(){$("input").trigger("focus");});結果として、buttonをクリックするとinput要素に「フォーカスされたよ」と表示されます。ここで着目するのが、input要素に「枠が付く」点です。buttonをクリックしたのですからフォーカスはbuttonにあるべきなのに、focusイベントがもつ「ブラウザ標準の機能」によりinput要素が選択(フォーカス)されたのです。triggerHandlerメソッドではブラウザ標準の処理はされないため、input要素が選択(フォーカス)されません。→参考:サンプル(triggerHandler/01.html)配列でイベント発生時の処理に引数を渡すtriggerメソッドは第2引数に配列を設定することで、イベント発生時の処理(function)に引数を渡すことができます。サンプル(trigger/02.html)を開いてbody内の構成がtrigger/01.htmlと同じ事を確認してください。jQueryは少し変更され、functionの第2引数の位置にaaaを追加しました(第1引数の場所はイベントオブジェクトです)。受け取った値はvalメソッドの引数に利用して、input要素内に表示します。aaa){$(this).val(aaa);});引数を渡すtriggerメソッドの設定は以下の様に、第2引数に配列を追加します(配列であることに注意してください)。この配列内の値がfunctionに設定した引数aaaに渡されます。$("button").click(function(){$("input").trigger("focus",["トリガ−"]);});結果として、buttonをクリックするとinput要素内に「トリガー」と表示されます。buttonではなくinput要素をクリックして選択(フォーカス)した場合は引数aaaを得られないため、何も表示されません。イベントオブジェクトを利用するv1.3から引数にイベントオブジェクトを利用できるようになりました。私にはあまり理解できず、説明が間違っているかもしれません。本家のページにイベントオブジェクトを利用したサンプルがあったので、それを元にサンプルを作成してみました。本家のページでは、submitが実行された時にブラウザ標準の機能であるデータ送信がキャンセルされたら他の処理をするようなサンプルがありました。それを元に考えたのがサンプル(trigger/03.html)です。body内にはdiv要素が3つあり、一番上のdiv要素にのみtestのid属性が付いています。id="test"></div><div></div><div></div>jQueryでは、まず以下の様にtestのid属性を持つ要素(一番上のdiv要素)にだけカスタムイベント(自作のイベント)の「myClick」を設定しています。実行する処理はアラートで「bbb」と表示するだけです。preventDefaultメソッドを利用して、ブラウザ標準の機能を停止している点です。div要素にはリンクやsubmitが設定されていないので、ブラウザ標準の機能をストップするというよりも、フラグを立てるような行為だと思います。次にdiv要素がクリックされた時に実行する以下の処理を確認して下さい。jQuery.Eventを利用してカスタムイベント「myClick」のイベントオブジェクトを作成し、3行目でそれをtriggerメソッドの引数に利用しています。これによりクリックされたdiv要素にカスタムイベント「myClick」が付いていた場合は、それが実行されます(つまり一番上のdiv様子がクリックされた時)。{alert("aaa");}});一番上のdiv要素をクリックした時は、カスタムイベントのmyClickが実行され、ブラウザ標準の機能を停止します。isDefaultPreventedメソッドを利用してブラウザ標準の機能が停止されているか否かを調査します。フラグの確認のような行為だと思います。上のdiv要素では、実際に停止されているため{}内の処理(アラートでaaaと表示する)は実行されません。上のdiv要素がクリックされると「bbb」は表示しますが「aaa」と表示するのはやめます。それ以外のdivをクリックした場合は、ブラウザ標準の機能は停止されていませんから4〜6行目の処理によってアラートで「aaa」と表示されます。私が思うに、これは「割り込み処理」の設定なのだと思います。本来の機能(aaaと表示する)ではなく、他の機能(bbbと表示する)を実行させています。なんとなく、プラグイン作成時に活躍するような気がします。本家のページのイベントオブジェクトを利用したサンプルは、もう1つあります。そのサンプルではイベントオブジェクトにオリジナルのプロパティを設定してfunctionに情報を渡すものでした。サンプル(trigger/04.html)を開いてbody内にbutton要素が1つあることを確認してください。jQueryでは、まず以下の部分を確認してください。onメソッドを利用してfunctionを設定しています。このfunctionはイベントオブジェクトのuserNameプロパティをアラートで表示するだけです。ポイントなのはjQueryが持つイベントオブジェクトのプロパティに「userName」というものは無い点です。function(eo){alert(eo.userName);});では、どこでuserNameプロパティが設定されているかというと、以下のbutton要素に設定したクリック時に実行するfunctionの中です。2行目でカスタムイベント「logged」のイベントオブジェクトを作成し、3行目でuserNameというプロパティを設定し値として「john」を代入しています。"john";$("body").trigger(myEvent);});そして、4行目でtriggerを利用してbody要素に設定されたカスタムイベント「logged」を実行するのです。結果として、buttonをクリックするとイベントオブジェクトのプロパティとして渡ったmyNameの値である「john」がアラートで表示されます。triggerHandlerメソッドを利用します。triggerHandlerメソッドは、イベントが伝播しないためdelegateメソッドやonメソッド(delegateメソッドの構文)で設定したイベントの処理には利用できません。triggerメソッドはイベントが伝播するので利用できます。サンプル(trigger/test01.html)を開いてbody内の構成がtrigger/01.htmlと同じ事を確認してください。jQueryもほとんどtrigger/01.htmlと同じで、異なるのは以下の様にonメソッドがdelegateメソッドの構文(第2引数にセレクタを設定)になっている点だけです。function(eo){$(this).val("フォーカスされたよ");});結果としてはtrigger/01.htmlと変わらず、buttonをクリックするとinput要素内に文字を表示します。triggerHandlerではバブリングしないため機能しません。→参考:サンプル(triggerHandler/test01.html)a要素のブラウザ標準の機能は「リンク」ではないのですか?triggerメソッドを利用してa要素をクリックするサンプルを作成したのですが、functionは実行されるものの、リンクの機能が実行されませんでした。サンプル(trigger/test02.html)を開いてbody内にa要素とbutton要素があることを確認してください。リンク先はyahooになっています。target="_blank">yahoo</a><button>CLICK</button>jQueryでは以下の部分を先に確認してください。textメソッドを利用してテキスト内容を「クリックされたよ」に変更します。実際にリンクをクリックすると、テキストを変更して別ウインドウでyahooのページを開きます。function(){$(this).text("クリックされたよ")});続いてbutton要素の処理を設定した以下の部分を確認してください。triggerメソッドを利用してa要素をクリックします。$("button").click(function(){$("a").trigger("click");});しかし実際にbuttonをクリックしても、a要素のリンクが実行されません。テキスト内容は「クリックされたよ」と変更されるので、functionは実行されています。?、a要素のブラウザ標準の機能はリンクではないのですか?ググってみたら結構出てきました、要するにa要素の「リンク」はブラウザ標準の機能ではないようです。a要素自体にはリンクの設定はなくアンカーの設定で、リンクはhref属性によってオプション的に追加されるからなのでしょう(たぶん)。検索した結果を参考に、リンクするサンプルを作成しましたが、正しいか確信は持てません...。"_blank");取得したリンク先を開く});$("button").click(function(){$("a").trigger("click");});v1.9での仕様変更v1.9以前はtriggerメソッドでラジオボタンやチェックボックスをクリックした際、それらを直接クリックした際の動作と異なっていました。サンプル(trigger/test03.html)を開いてbody内にチェックボックスとbuttonがあることを確認してください。jQueryでは、まず以下の部分を確認して下さい。チェックボックスがクリックされるとチェックの状態をアラートで表示するようになっています。$("input").prop("checked");alert(myStatus);})ですので、チェックボックスをクリックしてチェックを入れるとtrue、もう一度クリックしてチェックを外すとfalseと表示されます。続いてbuttonをクリックした時の処理を確認します。jQueryは以下の様に記述され、triggerでチェックボックスをクリックしているだけです。$("button").click(function(){$("input").trigger("click");});このサンプルでbuttonをクリックするとチェックボックスの現在の状態を表示してからクリック処理されます。チェックが入っていない時にbuttonをクリックすると、現在の状態であるfalseを表示してからチェックが入ります。v1.9では、このややこしい仕様が変更されました。サンプル(trigger/test03b.html)を開いてjQueryのバージョン以外はtrigger/test03.htmlと同じ事を確認して下さい。src="../../../css_js/jquery-1.9.0.min.js"></script>このサンプルではbuttonをクリックしてもチェックボックスをクリックしたのと同じ結果になります。複数の要素に対応していますtriggerHandlerメソッドが複数の要素に対応していないのに対し、triggerメソッドは対応しています。サンプル(trigger/test04.html)を開いてbody内にinput要素が3つあることを確認してください。jQueryはtrigger/01.htmlと同じですが、このサンプルではセレクタのinputにマッチする要素が3つあります。function(eo){$(this).val("フォーカスされたよ");});$("button").click(function(){$("input").trigger("focus");});結果としてbuttonをクリックすると、3つのinput要素すべてに「フォーカスされたよ」と表示されます。triggerHandlerメソッドのサンプルも確認してください。