7

カスタム イベントをリッスンしようとしていますが、名前空間が割り当てられているという事実を効果的に「無視」するか、個別に定義せずにすべての名前空間をリッスンしたいと考えています。

$('#test').on('custom', ...);

$('#test').trigger('custom.namespace1');
$('#test').trigger('custom.namespace2');

これを可能にしたい理由は、非表示/表示時にイベントを発生させる複数の ui プラグインがあるためです。これらのイベントは主に内部で使用されますが、互いに衝突しないように名前空間が付けられています。ただし、他のクリーンアップ ロジックを実行するソースとは関係なく、特定の ui 要素がいつ非表示になるかを知りたいだけです。

上記の例では、トリガー イベントがネームスペース化されているため、何も起こりません。の効果を持つすべての名前空間をリッスンできますcustom.*か?

問題を示すフィドル。

ありがとう

編集

このようなものでさえ望ましいですが、それでも機能させることはできません

$('#test').on('custom.global', log);

$('#test').trigger('custom.global.namespace1');
$('#test').trigger('custom.global.namespace2');

フィドル

4

3 に答える 3

1

triggerAll代わりに試してくださいtrigger：

(function($) {
    $.fn.triggerAll = function(topics, data, delimiter) {
        return this.each(function() {
            var $this = $(this), chain = [], t = '';
            delimiter = (delimiter || '.');
            // rebuild chain
            $.each(topics.split(delimiter), function(i,n) {
                t += (i == 0 ? '' : delimiter) + n;
                chain.push(t);
            });

            // append/prepend original topic?
            data = (data || []);
            data.push(topics);
            $.each(chain, function(i,t) {
                $this.trigger(t, data);
            });
        });
    };
})(jQuery);

確かに、jQueryが名前空間のトリガーを処理する方法により、「root」イベントをトリガーすると、実際には名前空間バージョンが起動されます。したがって、期待どおりの文字を取得するには、のような区切り文字に別の文字を使用して、次のよう/にイベントを宣言する必要があります。

var $o = $('#whatever');
// this will be triggered for all events starting with 'root'
$o.on('root', function () { console.log(Array.prototype.slice.call(arguments, 0)); });
// some arbitrary way to fire custom events
$o.on('click', function () {
    $o.triggerAll('root/custom1/subA', ['1st', '2nd'], '/');
    $o.triggerAll('root/custom2', [3, 4, 5], '/');
});

このフィドルの例

于 2013-02-20T22:36:43.643 に答える
0

私はちょうどこれに遭遇しました、そしてこれが私の解決策です。Javascript は楽しい言語であり、イベントは単なる文字列です。事前にイベントを定義して、それらを「すべて」のイベントに動的に追加してみませんか? 同期がずれることを心配する必要はありません。

必要に応じてこれを拡張できます。ウィジェットが登録されたら、それ自体を登録してリストに追加します。配列を使用してmyEvents.join(" ")、それらすべてを生成するだけです。アプリのブートストラップで、以下で行うことを行い、オブジェクト内のすべてのキーを「all」イベントに追加します。やりたいことはなんでもいい。

PS。私が使用する「ベント」の例は、https ://github.com/reedspool/jquery-event-aggregator/blob/master/eventAggregator.jquery.js からのものです。

var stand_in = {},
    $stan = $(stand_in),
    // Don't give Stan to anyone else, he's precious
    $empty = $(),
    trigger = function(name, ...args) {
      $stan.trigger.apply($stan, arguments);
      return $empty;
    },
    on = function(name, fn) {
      $stan.on(name, function(evt, obj) {
        // Shed the event object, who needs it?
        fn(obj);
      });

      return $empty;
    };
    
var Vent = {
  trigger: trigger,
  on: on
};
    
var events = {
  All: "",
  Custom1: "my1.event",
  Custom2: "my2.event"
}

for (var evt in events) {
	if (events.hasOwnProperty(evt) && evt !== 'All') {
    events.All += events[evt] + " ";
  }
}

Vent.on(events.Custom1, function () { alert(events.Custom1 + " trigger")});
Vent.on(events.All, function () { alert(events.All + " trigger")});

$("#btn").on('click', function () {
	Vent.trigger(events.Custom1);
});
$("#btn2").on('click', function () {
	Vent.trigger(events.Custom2);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<button id="btn">
Press Me
</button>
<button id="btn2">
Press Me 2
</button>

于 2016-08-26T19:48:30.233 に答える
0

唯一の方法は、on メソッドの最初の引数としてそれらすべてをリストすることだと思います...

$('#test').on('custom.ns1 custom.ns2 ...', function(evt){});

これは、プラグインが更新されているときに面倒なコードレビューを意味します...

于 2012-09-25T20:17:47.313 に答える