绑定到自定义jquery事件的所有名称空间
我正在尝试监听自定义事件，但我想有效地“忽略”它是命名空间或以某种方式监听所有命名空间而不单独定义它们的事实。
$('#test').on('custom', ...); $('#test').trigger('custom.namespace1'); $('#test').trigger('custom.namespace2'); 我希望能够做到这一点的原因是因为我有多个ui插件可以在隐藏/显示事件时触发事件。 这些事件主要在内部使用，但是命名空间，因此它们不会相互冲突。 但是，我还想知道隐藏特定ui元素的时间，与其源无关，以执行其他清理逻辑。
在上面的示例中，由于触发器事件是命名空间，因此不会发生任何事情。 我可以使用custom.*的效果来监听所有名称空间custom.* ？
小提琴演示了这个问题 。
谢谢
编辑
即使是这样的东西也是可取的，但仍然无法让它发挥作用
$('#test').on('custom.global', log); $('#test').trigger('custom.global.namespace1'); $('#test').trigger('custom.global.namespace2');
小提琴
尝试使用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], '/'); });
这个小提琴的例子
我担心唯一的办法就是将它们全部列为on方法的第一个参数……
$('#test').on('custom.ns1 custom.ns2 ...', function(evt){});
这意味着当插件更新时烦人的代码审查…
我刚碰到这个，这是我的解决方案。 Javascript是一种有趣的语言，事件只是字符串。 为什么不预先定义事件，只是动态地将它们添加到“全部”事件中？ 无需担心失去同步。
您可以根据需要扩展它。 注册窗口小部件时，让它自己注册并将其附加到列表中。 使用数组，只需执行myEvents.join(" ")即可生成所有数组。 在app bootstrap上，执行我在下面执行的操作，并将对象中的所有键添加到“all”事件中。 无论你想做什么都没关系。
PS。 我使用的“Vent”示例来自： 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); })