เหตุการณ์ onmouseenter

คำนิยามและวิธีใช้

เหตุการณ์ onmouseenter มีขึ้นเมื่อตัวบุปผาเคลื่อนย้ายตรงไปที่องค์ประกอบ.

คำแนะนำ:เหตุการณ์นี้มักถูกใช้ร่วมกับ เหตุการณ์ onmouseleaveใช้ร่วมกัน เหตุการณ์นี้จะเกิดขึ้นเมื่อตามตัวชิ้นงานมีการเคลื่อนที่ออกจากอิเลเมนต์

คำแนะนำ: เหตุการณ์ onmouseenter คล้ายกับ เหตุการณ์ onmouseoverความแตกต่างเดียวกันคือเหตุการณ์ onmouseenter จะไม่กระจาย (จะไม่แพร่กระจายไปยังโครงสร้างเอกสารขั้นบนของเอกสาร) โปรดดูตัวอย่างเพิ่มเติมที่ด้านล่างของหน้าเว็บไซต์

ตัวอย่าง

ตัวอย่าง 1

ปฏิบัติการ JavaScript ขณะเคลื่อนที่ตามตัวชิ้นงาน:

<img onmouseenter="bigImg(this)" src="smiley.gif" alt="Smiley">

ลองด้วยตัวเอง

ตัวอย่าง 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>

ลองด้วยตัวเอง

คำสั่ง

ใน 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 รุ่น: Level 2 Events

โปรแกรมบราวเซอร์สนับสนุน

ตัวเลขในตารางบอกว่าสำหรับเหตุการณ์นี้ สำหรับเวอร์ชั่นบราวเซอร์แรกที่สนับสนุนอย่างเต็มที่

เหตุการณ์ Chrome IE Firefox Safari Opera
onmouseenter 30.0 5.5 สนับสนุน 6.1 11.5