Sự kiện onmouseenter

Sự kiện DOM MouseEvent

Định nghĩa và cách sử dụng

Sự kiện onmouseenter xảy ra khi con trỏ chuột di chuyển đến phần tử.

Lưu ý:Sự kiện này thường được sử dụng với Sự kiện onmouseleavesử dụng cùng nhau, sự kiện này sẽ xảy ra khi con trỏ chuột rời khỏi phần tử.

Lưu ý: Sự kiện onmouseenter tương tự như Sự kiện onmouseover.Sự khác biệt duy nhất là sự kiện onmouseenter không bubbling (không truyền lên cấu trúc cấp cao hơn của tài liệu). Xem thêm các ví dụ khác ở cuối trang.

Mô hình

Ví dụ 1

Chạy JavaScript khi di chuột qua hình ảnh:

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

Thử ngay

Ví dụ 2

Ví dụ này演示 sự khác biệt giữa các sự kiện onmousemove, onmouseenter và mouseover:

<div onmousemove="myMoveFunction()">
  <p id="demo">Tôi sẽ演示 onmousemove!</p>
</div>
<div onmouseenter="myEnterFunction()">
  <p id="demo2">Tôi sẽ演示 onmouseenter!</p>
</div>
<div onmouseover="myOverFunction()">
  <p id="demo3">Tôi sẽ演示 onmouseover!</p>
</div>

Thử ngay

Cú pháp

Trong HTML:

<element onmouseenter="myScript">

Thử ngay

Trong JavaScript:

object.onmouseenter = function(){myScript};

Thử ngay

Trong JavaScript, sử dụng phương thức addEventListener():

object.addEventListener("mouseenter", myScript);

Thử ngay

Chú ý:Internet Explorer 8 hoặc sớm hơn không hỗ trợ Phương thức addEventListener().

Chi tiết kỹ thuật

Bubbling: Không hỗ trợ
Có thể hủy: Không hỗ trợ
Loại sự kiện: MouseEvent
Các thẻ HTML được hỗ trợ: Tất cả các yếu tố HTML, trừ: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> và <title>
Phiên bản DOM: Sự kiện cấp 2

Trình duyệt hỗ trợ

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ sự kiện này hoàn toàn.

Sự kiện Chrome IE Firefox Safari Opera
onmouseenter 30.0 5.5 Hỗ trợ 6.1 11.5
Sự kiện DOM MouseEvent