在html中,事件的處理都是在js中完成的,html,js和css是密不可分的。以下就是在js中處理拖曳事件的例子。
拖曳事件分兩大塊,一塊是對拖曳的目標上的處理(即拖曳目標);一塊是對拖曳到的目標上的處理(即釋放目標)。
在拖曳目標上觸發事件 (來源元素):
ondragstart - 使用者開始拖曳元素時觸發
ondrag - 元素正在拖曳時觸發
ondragend - 使用者完成元素拖曳後觸發
ondragend - 使用者完成元素拖曳後觸發
# 時觸發目標時觸發的事件:## ondragenter - 當被滑鼠拖曳的物件進入其容器範圍內時觸發此事件
ondragover - 當某被拖曳的物件在另一物件容器範圍內拖曳時觸發此事件
ondragleave - 當被滑鼠拖曳的物件離開其容器範圍內時觸發此事件ondrop - 在一個拖曳過程中,釋放滑鼠鍵時觸發此事件
實作程式碼如下:box1和lists可以互相拖曳
##其中: getElementsByTagName() 方法可傳回帶有指定標籤名的物件的集合。
e.preventDefault();是阻止系統預設的拖曳事件。
appendChild()是新增控制項到指定控制項。
e.preventDefault();
以上是html drag拖曳事件的詳細內容。更多資訊請關注PHP中文網其他相關文章!