概述
今天用H5的FileReader,drag,Formdata等仿照郵件的檔案上傳功能做了一個圖片拖拽上傳,主要流程如下:
1.監聽元素的ondrop事件,並獲取事件物件event.dataTransfer.files
的值
2.用FileReader讀取步驟1中獲取的值並新增到動態建立的li中
3.用Formdata獲取最終的值並用ajax2.0上傳
注意項:
ondragenter:需要阻止預設事件,否則ondrop不會執行;
ondrop:也需要阻止預設事件,否則圖片會預設在瀏覽器中開啟