Trang chủ
HTML
Kéo và thả HTML
Dùng thử: Thuộc tính ondrag và ondrop của HTML
Chạy ❯
Nhận trang web của
riêng
bạn
×
Thay đổi định hướng
Lưu mã
Thay đổi chủ đề, Tối/Sáng
Đi tới Không gian
<!DOCTYPE HTML> <html> <head> <style> #div1 { width: 350px; chiều cao: 70px; phần đệm: 10px; đường viền: 1px liền khối #aaaaaa; } </style> <script> function allowDrop(ev) { ev.preventDefault(); } hàm drag(ev) { ev.dataTransfer.setData("text", ev.target.id); } hàm drop(ev) { ev.preventDefault(); var data = ev.dataTransfer.getData("văn bản"); ev.target.appendChild(document.getElementById(data)); } </script> </head> <body> <p>Kéo hình ảnh Example.com.vn vào hình chữ nhật:</p> <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)" ></div> <br> <img id="drag1" src="img_logo.gif" draggable="true" ondragstart="drag(event)" width="336" Height="69"> </body> </html>