javascript – onMouseOver不触发特定功能

我有一个非常令人困惑的问题,我想知道是否有人可以解释它.

我有一个DIV元素……

<div onm ouseout="scrollRight();" onm ouseover="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 onm ouseover="alert('Hello');" id="rightScrollRegion" class="ScrollRegion"></div>

打印警报窗口就好了.

所以我想也许我无法使用onmouseover改变背景所以我试过……

<div onm ouseover="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
来源： https://codeday.me/bug/20190725/1536671.html