Thực thi script khi nhấn chuột xuống trên phần tử (onmousedown)

Để chạy script khi người dùng nhấn nút chuột xuống (chưa thả ra) trên một phần tử, bạn sử dụng thuộc tính sự kiện onmousedown.

Ví dụ minh họa

<!DOCTYPE html>
<html>
  <body>
    <h3 id="myid" onmousedown="mouseDown()" onmouseup="mouseUp()">
      Đây là tiêu đề demo.
    </h3>
    <p>Click vào tiêu đề trên và giữ, sau đó thả ra.</p>
    <script>
      function mouseDown() {
        document.getElementById("myid").style.color = "yellow";
      }
      function mouseUp() {
        document.getElementById("myid").style.color = "blue";
      }
    </script>
  </body>
</html>

Chuỗi sự kiện chuột (Mouse Event Sequence)

Khi click chuột, trình duyệt kích hoạt các sự kiện theo thứ tự:

1. mousedown - Nhấn nút chuột xuống.
2. mouseup - Thả nút chuột ra.
3. click - Click hoàn chỉnh (mousedown + mouseup trên cùng phần tử).

Ứng dụng thực tế

• Tạo hiệu ứng "nhấn xuống" cho nút bấm (button press effect).
• Drag & drop: Bắt đầu kéo khi mousedown.
• Context menu tùy chỉnh (kết hợp với contextmenu event).
• Game: Xử lý bắn, nhảy, di chuyển khi giữ phím.

Lưu ý

Sự kiện onmousedown kích hoạt cho tất cả các nút chuột (trái, phải, giữa). Kiểm tra event.button nếu cần phân biệt:

• 0: Nút trái
• 1: Nút giữa (cuộn)
• 2: Nút phải