守着星空守着你
用到两个对象第一个对象:FormData第二个对象:XMLHttpRequest目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 FormData 对象,还在用IE6 ? 只能仰天长叹....有了这两个对象,我们可以真正的实现Ajax方式上传文件。示例代码:<!DOCTYPE html><html><head><title>Html5 Ajax 上传文件</title><script type="text/javascript">function UpladFile() {var fileObj = document.getElementByIdx_x_x("file").files[0]; // 获取文件对象var FileController = "../file/save"; // 接收上传文件的后台地址// FormData 对象var form = new FormData();form.append("author", "hooyes"); // 可以增加表单数据form.append("file", fileObj); // 文件对象// XMLHttpRequest 对象var xhr = new XMLHttpRequest();xhr.open("post", FileController, true);xhr.onload = function () {alert("上传完成!");};xhr.send(form);}</script></head><body><input type="file" id="file" name="myfile" /><input type="button" onclick="UpladFile()" value="上传" /></body></html>很简洁的代码,便可以达到Ajax方式上传文件,上面的代码中使用<input type="file" />这种传统的选择文件的方法产生文件对象,HTML5还支持使用多种更灵活的方式,如拖拽文件到指定的元素上产生。