推薦課程HTML5教程拖drag放drop在頁面中是一種常見的HTML5特效，它所表示的就是抓取對象以后再拖放到另一個位置在 HTML5 中，任何元素都能可以進行拖放，所以接下來在文章中將通過實例詳細告訴大家如何實現(xiàn)拖。

這個需要用到j(luò)avascript，拖拽時添加屬性樣式就行了。

html5這個屬性只是標(biāo)明這個層，可以做這個動作而已你真正要操作這個動作，你需要js來操作它。

1創(chuàng)建兩個html文件，一個test一個test22打開test頁面，在里面創(chuàng)建一個div，并給其添加onmousedown與move方法3打開后我們發(fā)現(xiàn)是一個棕綠的頁面4定義兩個變量，startx為鼠標(biāo)按下的坐標(biāo)，endx為鼠標(biāo)移動的坐標(biāo)。

ondrop事件被拖拽的元素在目標(biāo)元素上同時鼠標(biāo)放開觸發(fā)的事件，作用在目標(biāo)元素上ondragend事件拖拽完成后觸發(fā)事件，作用在被拖拽元素上EventpreventDefault方法阻止默認方法執(zhí)行ondragover中一定要執(zhí)行preventDefault。

拖拽的過程就不說了，這里主要說一下如何在前端獲取到圖片的相關(guān)信息html5里有一個fileReader的全局變量，用來讀取本地文件，比如txt，img等，下面是一個簡單的代碼function checkFilefilesvar file = files0var。