1. 程式人生 > 實用技巧 >H5拖拽事件

H5拖拽事件

在H5中新增的標籤 事件中 拖拽事件也是其中之一!
H5拖拽的7個事件分別為:
ondragstart 只能在這個事件的過程中支援dataTransfer通過setData來設定資料。
ondrag 拖動過程中持續發生的事件。就是滑鼠移動的過程中會反覆的呼叫此事件。
ondragenter 拖動跨入了頁面中新元素的時候觸發,適用於設定拖放的放置反饋。
ondragleave 恢復放置反饋,與上一事件相對。
ondragover 不同於drag事件,此事件是在當前滑鼠停留的目標上呼叫。
ondrop 釋放滑鼠呼叫,要放置包含處理放置動作的程式碼。
ondragend 在拖動源中觸發,適合清空拖動過程的狀態。

0.在這裡插入圖片描述
建立兩個DIV 設定DIV樣式
在這裡插入圖片描述
在這裡插入圖片描述
在這裡插入圖片描述
拖拽出DIV使其顏色邊改 成紅色

在這裡插入圖片描述