HTML5 實現(xiàn)拖放API的過程

    在HTML5中，要想實現(xiàn)拖放操作，至少需要經(jīng)過如下兩個步驟。

  1.把要拖放的對象元素的draggable屬性設(shè)置為true(draggable="true"),這樣才能拖放該元素，

代碼實例如下：

    <div draggable="true">可以對我進(jìn)行拖拽!</div>

    另外，img元素與a元素（必須制定href)默認(rèn)允許拖放。

  2.編寫與拖放有關(guān)的事件處理代碼。

    下面是與拖放有關(guān)的幾個主要事件：

    ?ondtagstart事件: 當(dāng)拖拽元素開始被拖拽時觸發(fā)的事件，此事件作用在被拖拽的元素上。

    ?ondragenter事件：當(dāng)拖拽元素進(jìn)入目標(biāo)元素時觸發(fā)的事件，此事件用在目標(biāo)兀素上。

    ?ondragover事件：當(dāng)拖拽元素在目標(biāo)元素上移動時觸發(fā)的事件，此事件用在目標(biāo)元素上。

    ?ondrop事件：當(dāng)被拖拽元素在目標(biāo)上同時松開鼠標(biāo)時觸發(fā)的事件，此事件作用在目標(biāo)元素上。

    ?ondragend事件：當(dāng)拖拽完成后觸發(fā)的事件，此事件作用在被拖拽的兀素上。