jquery - 连接许多具有相同事件名称但不同命名空间的事件

Question

假设我有以下人为的代码：

function runTriggers() {
    $(document).trigger('mytrigger.ns1');
    $(document).trigger('mytrigger.ns2');
    $(document).trigger('mytrigger.ns3');
    ...
}

如何连接一个事件处理程序来简单地监听，mytrigger而不必担心提及将来可能出现的每一种类型的命名空间触发器？

我试过了

$(document).on('mytrigger', doSomething);

但它不起作用。

Answer 1

根据命名空间事件的文档：

$('.class').bind('click.namespace', function(){}); 
$('.class').trigger('click.namespace'); // Will trigger
$('.class').trigger('click');           // Will trigger
$('.class').trigger('click.other');     // Won't trigger

所以你设计的代码肯定是行不通的，但你可以按如下方式反转逻辑：

$(document).on('mytrigger.ns1', doSomething1);
$(document).on('mytrigger.ns2', doSomething2);
$(document).on('mytrigger.ns3', doSomething3);

然后：

function runTriggers() {
    $(document).trigger('mytrigger'); // will trigger all three `doSomething` handlers.
    ...
}

Answer 2

这是一种解决方法，可让您靠近。首先，向字符串原型添加一个方法：

String.prototype.namespaces = function () {
    var eventName = this + ".";
    var args = Array.prototype.slice.call(arguments);
    return eventName + args.join(" " + eventName);
}

然后，您可以使用以下.namespaces(namespace1, namespace2...)表示法为同一事件绑定到多个命名空间：

$(function () {

   $("#mydiv").on("someevent".namespaces("a","b"), function() {
       alert("hello"); 
    });

   $("#mydiv").trigger("someevent.a");
   $("#mydiv").trigger("someevent.b");     
});

这是一个jsfiddle。