JavaScript OnMouseOut事件_IT百科

javascript onmouseover和onmouseout事件

onmouseover和onmouseout鼠标移入移出时触发的事件：

onmouseover 用户鼠标移入元素时触发的事件。并执行onmouseover调用的函数。

onmouseout 用户鼠标移开元素时触发的事件。并执行onmouseout调用的函数。

onmouseover和onmouseout 这两个事件在javascript中较常用。

下面通过一个示例更深入了解这两个事件的使用：

示例：鼠标移入时，改变字体的背景色，移出时，还原默认的背景色。

<!DOCTYPE html>

<html>

<head>

<title>鼠标移入时，改变字体的背景色，移出时，还原默认的背景色。</title>

<style>

.xuexi{width:200pxheight:120pxbackground:#abcdefborder:1px solid green}

</style>

function aixuexi(){

var woaixuexi=document.getElementById("woaixuexi")

woaixuexi.style.background="yellowgreen"

}

function xuexi(){

var xuexi=document.getElementById("woaixuexi")

xuexi.style.background="#abcdef"

}

</script>

</head>

<body>

</body>

</html>

告诉你DOM2级事件处理的标准答案（摘自《javascript高级程序设计》）：

//首先事件绑定函数：

var addHandler = function(element,type,handler){//被绑定的dom对象，绑定类型，事件处理函数

if(element.addEventListener){//非ie中的处理element.addEventListener(type,handler,false)//false表示在冒泡阶段调用函数

}else if(element.attachEvent){//ie中的处理

element.attachEvent("on" + type,handler)

}else{//如果该浏览器对DOM2级不支持，则使用DOM0级方式。

element["on" + type] = handler

}

使用的时候：

var btn = document.getElementById("xxx")

var handler = function(){alert(456)}

addHandler(btn,"mouseover",handler)

ok了。我少敲了移除事件绑定的内容，因为，你没问。。。

欢迎分享，转载请注明来源：内存溢出

JavaScript OnMouseOut事件