Sự kiện onmouseleave trong JavaScript

• Trần Thị Vân
• 1094
• 28/08/2025

Chức năng của Sự kiện onmouseleave trong JavaScript

Sự kiện onmouseleave trong JavaScript hoạt động như onmouseout dùng để tạo sự kiện sau khi người dùng bỏ rê chuột khỏi thẻ HTML.

Code Sự kiện onmouseleave trong JavaScript

Sự kiện onmouseleave gán trực tiếp trong JavaScript

onmouseleave="doiMau()"

<div id="kvuong" onmouseleave="doiMau()">Rê vào, rê ra</div>
<script>
function doiMau(){
var kvuong = document.getElementById('kvuong');
kvuong.style.background = 'green';
}
</script>

Chạy Thử

Sự kiện onmouseleave không gán trực tiếp trong JavaScript

kvuong.onmouseleave = function(){
  kvuong.style.background = 'green';
};

<div id="kvuong" >Rê vào, Rê ra</div>
<div id="kvuong2" >Rê vào, Rê ra</div>
<script>
var kvuong = document.getElementById('kvuong');
kvuong.onmouseleave = function(){
kvuong.style.background = 'green';
};

var kvuong2 = document.getElementById('kvuong2');
kvuong2.addEventListener('mouseleave', function(){
kvuong2.style.background = 'green';
});
</script>

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Sự kiện onmouseleave trong JavaScript.