JavaScript HTML DOM onmouseenter 事件

  • onmouseenter 事件

    将鼠标指针移动到元素上时会发生onmouseenter事件。
    提示:此事件通常与onmouseleave事件一起使用,事件在鼠标指针移出元素时发生。
    提示onmouseenter事件类似于onmouseover事件。唯一的区别是onmouseenter事件不会冒泡(不会传播文档层次结构)。请参阅本页底部的“更多示例”,以便更好地了解这些差异。
    将鼠标指针移动到图像上时执行JavaScript:
    <img onmouseenter="bigImg(this)" src="/images/smiley.png" alt="Smiley">
    
    尝试一下
  • 浏览器支持

    IE/Edge Chrome FireFox Safari Opera
    事件
    onmouseenter
    5.5+
    30.0+
    支持
    6.1+
    11.5+
  • 语法

    在HTML中:
    <element onmouseenter="myScript">
    在JavaScript中:
    object.onmouseenter = function(){myScript};
    在JavaScript中,使用addEventListener()方法:
    object.addEventListener("mouseenter", myScript);
    注意:在Internet Explorer 8和更早版本不支持使用addEventListener()方法。
  • 技术细节

    项目 描述
    冒泡: 没有
    取消: 没有
    事件类型: MouseEvent
    支持的HTML标记: 所有HTML元素,除了:<base><bdo><br><head><html><iframe><meta><param><script><style><title>
    DOM版本 DOM Event Level 2
  • 更多例子

    此示例演示onmousemove,onmouseenter和mouseover事件之间的区别:
    <div onmousemove="myMoveFunction()">
      <p id="demo">我将演示onmousemove!</p>
    </div>
    
    <div onmouseenter="myEnterFunction()">
      <p id="demo2">我将演示onmouseenter!</p>
    </div>
    
    <div onmouseover="myOverFunction()">
      <p id="demo3">我将演示onmouseover!</p>
    </div>
    尝试一下