DragEvent
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020.
DragEvent là một giao diện DOM event đại diện cho một tương tác kéo và thả. Người dùng bắt đầu kéo bằng cách đặt một thiết bị trỏ (chẳng hạn như chuột) lên bề mặt cảm ứng rồi kéo con trỏ đến một vị trí mới (chẳng hạn như một phần tử DOM khác). Ứng dụng có thể tự do diễn giải một tương tác kéo và thả theo cách riêng của ứng dụng.
Giao diện này kế thừa các thuộc tính từ MouseEvent và Event.
Thuộc tính của thể hiện
DragEvent.dataTransferRead only-
Dữ liệu được truyền trong quá trình tương tác kéo và thả.
Hàm tạo
Mặc dù giao diện này có hàm tạo, không thể tạo một đối tượng DataTransfer hữu ích từ script, vì các đối tượng DataTransfer có mô hình xử lý và bảo mật được trình duyệt điều phối trong suốt quá trình kéo và thả.
DragEvent()-
Tạo một
DragEventtổng hợp và không đáng tin cậy.
Kiểu sự kiện
drag-
Sự kiện này được phát khi một phần tử hoặc vùng chọn văn bản đang được kéo.
dragend-
Sự kiện này được phát khi một thao tác kéo kết thúc (do nhả nút chuột hoặc nhấn phím escape).
dragenter-
Sự kiện này được phát khi một phần tử hoặc vùng chọn văn bản đang bị kéo đi vào một vùng thả hợp lệ.
dragleave-
Sự kiện này được phát khi một phần tử hoặc vùng chọn văn bản đang bị kéo rời khỏi một vùng thả hợp lệ.
dragover-
Sự kiện này được phát liên tục khi một phần tử hoặc vùng chọn văn bản đang được kéo và con trỏ chuột đang ở trên một vùng thả hợp lệ (mỗi 50 ms KHI chuột không di chuyển CÒN nếu không thì nhanh hơn nhiều, khoảng giữa 5 ms khi di chuyển chậm và 1 ms khi di chuyển nhanh). Mẫu phát này khác với
mouseover. dragstart-
Sự kiện này được phát khi người dùng bắt đầu kéo một phần tử hoặc vùng chọn văn bản.
drop-
Sự kiện này được phát khi một phần tử hoặc vùng chọn văn bản được thả lên một vùng thả hợp lệ.
Ví dụ
Ví dụ cho từng thuộc tính, hàm tạo, kiểu sự kiện và trình xử lý sự kiện toàn cục được bao gồm trong trang tham chiếu tương ứng của chúng.
Thông số kỹ thuật
| Specification |
|---|
| HTML> # the-dragevent-interface> |