在 jQuery 1.7.2 中 on("click") 和 on("click.randomText") 有啥区别？

Posted 2023-02-23

【中文标题】在 jQuery 1.7.2 中 on("click") 和 on("click.randomText") 有啥区别？

【英文标题】：In jQuery 1.7.2 what is the difference between on("click") and on("click.randomText")?在 jQuery 1.7.2 中 on("click") 和 on("click.randomText") 有什么区别？

【发布时间】：2012-06-13 15:04:32

【问题描述】：

我继承了一个使用 jQuery 1.7.2 的应用程序。

在整个应用程序中，我们有如下代码：

$('#quotation').off("click").on("click", function()
     // do something here...

现在，我确实明白上面没有问题。然而，偶尔在我们的代码中我会遇到这样的事情：

$('#continue').off("click.products").on("click.products", function()
     // do something here...

在整个应用程序中，我找到了click.products 或click.orders。似乎. 后面的内容可以是完全随机的文本。

click 和 click.products 有什么区别？

【参考方案1】：

此代码使用他们自己或插件定义的自定义命名空间事件。

事件名称可由事件命名空间限定，以简化删除或触发事件。例如，“click.myPlugin.simple”为这个特定的点击事件定义了 myPlugin 和 simple 命名空间。通过该字符串附加的单击事件处理程序可以使用 .off("click.myPlugin") 或 .off("click.simple") 删除，而不会干扰附加到元素的其他单击处理程序。命名空间类似于 CSS 类，因为它们不是分层的；只有一个名字需要匹配。以下划线开头的命名空间保留给 jQuery 使用。

on docs

Live DEMO:

$('#a').on('click.bar', function() 
    console.log('bar');
);

$('#a').on('click.foo', function() 
    console.log('foo');
);


$('#b').click(function() 
    $('#a').trigger('click.foo');
);​

现在，当点击 #a 时，两个点击处理程序（foo 和 bar）都会引发， 但是当点击#b 时，只会引发 foo。

【讨论】：

那么，点击不再是指点击事件了？

如果click.xxx 不再是click 事件，那么当点击控件时，里面的函数怎么仍然执行？它一定还在以某种方式引用click 事件？

+1 顺便指出文档。我从来没有意识到检查文档，因为我认为以前的开发人员做了一些与on() 无关的自定义操作。我想我现在明白了。非常感谢您的快速答复。 （尝试 +1，但还不能，只有 15 代表，抱歉，虽然达到 15，但会回来的 :)）

@Jason。其实我对触发器的看法是不对的。检查this demo。

演示中不错的一个。我想我现在明白了。似乎您可以将多个事件附加到同一个元素，通过使用命名空间将它们分开。我检查了$("#a").data("events")，发现附加了多个点击事件，还有一个名为namespace 的属性，其中包含文本bar 用于一个事件，foo 用于另一个click 事件。再次感谢您的帮助。