web-dev-qa-db-ja.com

jQuery .trigger()複数のイベント

私はjQueryプラグインを作成していて、.onおよび.triggerをパブ/サブシステムとして使用しています。ただし、さまざまなシナリオで複数のイベントをトリガーしたいと思います。

これは、.onメソッドのように、1つの文字列として実行できますか?

ゴール:

$this.trigger("success next etc");    // doesn't work

現在のソリューション:

$this
    .trigger("success")
    .trigger("next")
    .trigger("etc");                  // works, triggers all three events

助言がありますか?

23
Zach Wolf

JQuery自体は複数のイベントのトリガーをサポートしていませんが、カスタム拡張メソッドtriggerAllを作成できます

(function($) {
    $.fn.extend({
        triggerAll: function (events, params) {
            var el = this, i, evts = events.split(' ');
            for (i = 0; i < evts.length; i += 1) {
                el.trigger(evts[i], params);
            }
            return el;
        }
    });
})(jQuery);

次のように呼び出します:

$this.triggerAll("success next etc");
33
hazzik

あなたが持っているものは問題ありません...コンマ区切りのリストを使用して複数のイベントをトリガーすることはできません。 trigger()コンストラクターは、イベント名とオプションの追加パラメーターのみを取り、イベントハンドラーに渡します。

代わりに、要素に関連付けられたすべてのイベントをトリガーすることもできますが、異なるシナリオで特定のイベントをトリガーする必要がある場合は、これはニーズを満たさない可能性があります。

$.each($this.data('events'), function(k, v) {
    $this.trigger(k);
});​
6
Derek Hunziker

後で誰かがこの質問に出くわした場合に備えて、カスタムjQuery関数を作成してこれを解決しました。

$.fn.triggerMultiple    =   function(list){
    return this.each(function(){
        var $this = $(this); // cache target

        $.each(list.split(" "), function(k, v){ // split string and loop through params
            $this.trigger(v); // trigger each passed param
        });
    });
};

$this.triggerMultiple("success next etc"); // triggers each event
6
Zach Wolf

私にはコメントする特権がないので、$this.data('events') doesn't work、内部のuse関数を使用する必要があることを指摘したいと思います。 $._data($this[0], 'events')

0
deviprsd