javascript - onMouseOver 不触发特定功能

标签 javascript onmouseover

我有一个非常令人困惑的问题,我想知道是否有人可以阐明它。

我有一个 DIV 元素......

<div onmouseout="scrollRight();" onmouseover="scrollLeft();" id="rightScrollRegion" class="ScrollRegion"></div>

还有一个外部脚本文件...

function scrollLeft(){
        document.getElementById('rightScrollRegion').style.background = "#0000ff";
    }

    function scrollRight(){
        document.getElementById('rightScrollRegion').style.background = "#ff0000";
    }

问题是onmouseover好像没有调用函数scrollLeft();或 scrollRight();我似乎不明白我在哪里犯了错误。

我做了一些测试,看看它是否在函数中......

window.onload = function(){

scrollLeft();

在外部文件中工作,并在页面加载时更改 DIV 的背景……因此功能有效。

我还尝试更改 onmouseover 中的调用...

<div onmouseover="alert('Hello');" id="rightScrollRegion" class="ScrollRegion"></div>

打印一个警告窗口就好了。

所以我想也许我无法使用 onmouseover 更改背景,所以我尝试了......

<div onmouseover="this.style.background = '#0000ff'" id="rightScrollRegion" class="ScrollRegion"></div>

这会按预期更改背景。

但出于某种原因,我无法让我的函数在 DIV 上触发。我在整个互联网上进行了搜索,但一直无法找到解决该问题的方法。我似乎无法找出我做错了什么。我在其他网站上使用过外部功能,但从未使用过 onmouseover,所以我不确定可能是什么问题。

如有任何帮助,我们将不胜感激。

最佳答案

试试这个:

element = document.getElementById('rightScrollRegion');
element.addEventListener("mouseover",function(){
    this.style.background = "#0000ff";
});
element.addEventListener("mouseout",function(){
    this.style.background = "#ff0000";
});

避免使用内联事件处理程序。使用 addEventListener 方法将事件监听器附加到元素。

您可以在这里尝试:http://jsfiddle.net/gkvq8/

关于javascript - onMouseOver 不触发特定功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13433447/

相关文章:

Javascript onMouseover 交换图像

javascript - reactjs 可拖动和可调整大小的组件

javascript - 如何使用 ES5 原型(prototype)重构类表达式?

javascript - MM_swapImage OnMouseOver 在 IE 中不工作

JavaScript 代码无法正常运行

Javascript onmouseover 不会在 IE 中触发

Javascript 静态方法与性能上的原型(prototype)/实例化方法

javascript - 如何防止从 JavaScript 控制台调用 'Meteor.call'?

javascript - Bootstrap : modal. js v3.2.0 嵌套弹窗

javascript - 使用鼠标悬停文本链接激活 div 悬停