.on（）没有检测到dom变化

让我的.on()工作有些问题。 我的网站在这里 。

如果你看看www.eliteweb-creation.co.uk/dev/js/nav.js，我在$('a.left.active')上设置一些关于mouseenter和mouseleave事件处理程序$('a.left.active')

为了将来查看此post的任何人，我已将代码添加到jsfiddle：

http://jsfiddle.net/TcbAP/

锚点在单击时动态添加.active ，因此使用.on()而不是.on() ，以便jQuery检测到dom更改并添加事件处理程序。

在添加.active类之前我的.on("click") for anchors工作正常，问题似乎是.on()没有检测到类更改。

任何和所有的帮助表示赞赏。

Answer 1

使用.on()不会神奇地使代码检测到更改。

您必须从不更改的祖先元素委派click事件处理程序：

 $('.nav').on('click', 'a.active', function(e) { // Put your code here... }); 

您可以在jQuery文档中阅读有关它的更多信息： 直接和委派事件

Answer 2

.on只会在运行时附加到符合条件的元素，这就是为什么他们建议将这些定义放在document.ready 。

来自jQuery API：

事件处理程序仅绑定到当前选定的元素; 它们必须存在于您的代码调用.on（）时页面上

除非再次运行.on定义，否则它不会重新评估新修改的元素。 您可以更广泛地定义并根据需要检查其他类：

 $('a.left').on("click", function(event){ if($(this).hasClass('active')) { // Do fancy stuff here } }); 

编辑：代码清理