InputEvent: thuộc tính dataTransfer
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Thuộc tính chỉ đọc dataTransfer của giao diện InputEvent trả về một đối tượng DataTransfer chứa thông tin về dữ liệu văn bản giàu định dạng hoặc văn bản thuần túy đang được thêm vào hoặc xóa khỏi nội dung có thể chỉnh sửa.
Giá trị
Một đối tượng DataTransfer hoặc null. Đặc điểm kỹ thuật có một tổng quan về giá trị của nó trong các trường hợp khác nhau.
Ví dụ
Trong ví dụ đơn giản sau, chúng ta đã thiết lập một trình lắng nghe sự kiện trên sự kiện input để khi bất kỳ nội dung nào được dán vào phần tử <p> có thuộc tính contenteditable, nguồn HTML của nó được truy xuất thông qua phương thức InputEvent.dataTransfer.getData() và được báo cáo trong đoạn văn bên dưới đầu vào.
Hãy thử sao chép và dán một số nội dung được cung cấp để xem hiệu ứng.
<p><span style="font-weight: bold; color: blue">Whoa, bold blue text!</span></p>
<p>
<span style="font-style: italic; color: red">Exciting: italic red text!</span>
</p>
<p>Boring normal text ;-(</p>
<hr />
<p contenteditable="true">
Go on, try pasting some content into this editable paragraph and see what
happens!
</p>
<p class="result"></p>
const editable = document.querySelector("p[contenteditable]");
const result = document.querySelector(".result");
editable.addEventListener("input", (e) => {
result.textContent = e.dataTransfer.getData("text/html");
});
Đặc điểm kỹ thuật
| Specification |
|---|
| Input Events Level 2 # dom-inputevent-datatransfer |