原标題:HTML的拖拽接口,老程式員經驗總結,純!幹!貨
⒈什麼是拖拽?
本質上來說就是一個對象和一個對象直接傳遞。
其實學習拖拽,就是學習拖拽事件。
⒉在HTML5中很多元素是不能進行拖拽的,比如說圖檔和超連結:
在試圖拖拽時你會發現一個禁止的符号,如果想拖拽元素,就必須為元素添加draggable="true"。
⒊相關的事件
應用于被拖拽元素的事件
ondrag 應用于拖拽元素,整個拖拽過程都會調用--持續
ondragstart 應用于拖拽元素,當拖拽開始時調用
ondragleave 應用于拖拽元素,當滑鼠離開拖拽元素時調用
ondragend 應用于拖拽元素,當拖拽結束時調用
應用于目标元素的事件
ondragenter 應用于目标元素,當拖拽元素進入時調用
ondragover 應用于目标元素,當停留在目标元素上時調用
ondrop 應用于目标元素,當在目标元素上松開滑鼠時調用
ondragleave 應用于目标元素,當滑鼠離開目标元素時調用
案例:
注意:如果想觸發ondrop事件,那麼就必須在ondragover事件中阻止浏覽器的預設行為。
來源網絡,侵權聯系删除傳回搜狐,檢視更多
責任編輯: