HTML5 圖片拖拽代碼 HTML5 提供了一個很方便的功能，就是圖片的拖拽。當我們需要拖拽一張圖片時，可以使用以下代碼實現。首先需要給圖片添加一個 draggable 屬性，表示該圖片可被拖拽。然后在 JavaScript 中監聽圖片的 dragstart 事件和 drop 事件，對圖片進行拖拽的操作。 代碼如下：

請嘗試拖拽以下圖片：

JavaScript 代碼如下：

function dragStart(event) {
event.dataTransfer.setData("text", event.target.id);
}
function drop(event) {
event.preventDefault();
var data = event.dataTransfer.getData("text");
var img = document.getElementById(data);
event.target.appendChild(img);
}

在上面的代碼中，dragStart() 函數將圖片的 ID 存儲在 dataTransfer 對象中，即將該圖片拖拽的數據傳輸。而 drop() 函數在拖拽時觸發，阻止默認的行為，并將被拖拽的數據從 dataTransfer 中獲取。然后通過獲取該圖片的 ID，將該圖片添加到目標元素中去。 需要注意的是，想要使用拖拽功能，必須添加 ondragstart 和 ondrop 事件，才能觸發對應的函數。 以上就是實現 HTML5 圖片拖拽的代碼，希望可以幫到你。