.on（）没有检测到dom变化 [英] .on() not detecting dom change

问题描述

获取我的 .on（）有一些问题。我的网站是 here 。

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

为了将来查看这篇文章的人，我已经将代码添加到jsfiddle：

http://jsfiddle.net/TcbAP/

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

我的 .on（click）在添加 .active 类之前，锚点正常工作，这个问题似乎是 .on（）没有检测到班级的变化。

任何和所有的帮助都不胜感激。

解决方案

使用 .on（）不会神奇地使您的代码检测到更改。

必须从一个祖先元素委托点击事件处理程序不更改：

  $（'。nav'）。on（'click'，'a.active' （e）{
 //将你的代码放在这里... 
}）; 
  

您可以在 jQuery docs：直接和委派事件

Having some problems getting my .on() working. My site is here.

If you take a look at www.eliteweb-creation.co.uk/dev/js/nav.js, I am setting up some on mouseenter & mouseleave event handlers on $('a.left.active')

For the sake of anyone viewing this post in the future, I have added the code to jsfiddle:

http://jsfiddle.net/TcbAP/

The anchors have .active added to them dynamically when clicked on, hence using .on() instead of .click() so that the jQuery detects the dom changes and adds the event handler.

My .on("click") for the anchors before adding the .active class are working fine, the issue seems to be for .on() not detecting the class change.

Any and all help is appreciated.

解决方案

Using .on() does not magically make your code detect changes.

You have to delegate the click event handler from an ancestor element that doesn't change:

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

You can read more about it in the jQuery docs: Direct and delegated events

这篇关于.on（）没有检测到dom变化的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！