JQuery鼠标悬停功能多次触发

时间:2014-06-11 13:11:51

标签: javascript jquery css

我一直在使用这种方法为整个类设置事件(对于按钮等):

$("div.bigButton").mouseover(function() { this.style.backgroundColor = '#dfdfdf'; });

然而,在进行一些测试时,我注意到当将鼠标移动到这些对象上时,该功能会触发3次!这在改变像backgroundColor这样的东西时是不明显的,但是如果我添加一个警报就很明显了。

任何想法我做错了什么?我担心这可能会对以后的表现产生影响。

由于

编辑:对不起,错过“风格”关闭是一个错字

HTML是:

<div class="bigButton">
Test</div>

3 个答案:

答案 0 :(得分:7)

由于HTML元素中的嵌套,可能会发生这种情况。 jQuery文档在页面底部有一个完美的例子(不要混淆mouseovermouseenter),以及一个防止这种不需要的行为的例子。 http://api.jquery.com/mouseover/

答案 1 :(得分:3)

我发现设置按钮的功能正在多次运行(每次通过ajax传送页面内容时)。我原以为这会覆盖'鼠标悬停'功能,但似乎它正在添加它!

感谢您的帮助

答案 2 :(得分:2)

如果它是悬停效果,您应该使用.hover.mouseenter.mouseleave

同时检查可能是您问题的子元素冒泡的事件。

<强>更新

通过尝试fiddle,我似乎无法重现您的问题,因此您的问题在于HTML / JavaScript代码。也许你三次附上手柄?