Ajax方式上传文件

来源：互联网发布：局域网网络行为管理编辑：程序博客网时间：2024/06/01 21:08

用到两个对象：FormData和XMLHttpRequest

有了这两个对象，我们可以真正的实现Ajax方式上传文件。
目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象，但IE9尚未支持 FormData 对象，还在用IE6 ?只能仰天长叹….
示例代码：

<!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>

0 0