html5通過ajax上傳檔案並顯示進度

通過ajax上傳檔案，需要用到乙個html5新特性——formdata（相容性：chrome，ff，ie9及以上）

整套上傳檔案的思路是：

構建乙個formdata->把檔案dom物件塞到formdata裡面->send出去。

前端html**：

上傳

這裡不需要有乙個顯示的form標籤，因為你的資料完全由formdata物件構建，所以html**只需要有個input用來獲取檔案就可以了。

原生js**：

xhr.open('post', 這裡是你的url , true);

xhr.send(fd);

注意：這裡加入：xhr.setrequestheader("content-type" , "multipart/form-data" );的話，在chrome和ff中會無法傳送資料。

var fd = new formdata();

var file = $('#thefile')[0].files[0];
$.ajax(, false);
}return xhr;
},async: true
}).then(function(data)  else 
})

html5通過canvas實現刮刮卡效果示例分享

修改img.src時塗層也會自動適應新的尺寸.修改layer函式可更改塗層樣式 以下是html源 已增加移動裝置支援 複製 如下 需要判斷是否刮完時用這段 替換原 的eventup事件處理函式 複製 如下 e.preventdefault mousedown false var data ctx.g...

HTML5 非同步上傳檔案

最近公司要做手機端 要用到上傳，手機端一般不能用 swfupload 類似flash的上傳工具 對 flash 支援不好 不過現在手機瀏覽器 都支援html5了 所以 這幾天網上查了下 實現使用html5 上傳檔案 其實 html5 上傳檔案挺簡單的 直接 new formdata 這個基於xmlh...

HTML5 檔案上傳

源 function getobjecturl file var url null if window.createobjecturl undefined else if window.url undefined else if window.webkiturl undefined return u...