摘要：利用对象，我们可以通过用一些键值对来模拟一系列表单控件，我们还可以使用的方法来异步的提交表单。与普通的相比，使用的最大优点就是我们可以异步上传二进制文件。
每次在向服务器提交文件对象数据是，总是需要借助各种三方插件来实现表单异步提交功能，还要为不同的界面去定制不同的插件css，相当繁琐。XMLHttpRequest Level 2 添加了一个新的接口——FormData。利用 FormData 对象，我们可以通过 JavaScript 用一些键值对来模拟一系列表单控件，我们还可以使用 XMLHttpRequest 的 send() 方法来异步的提交表单。与普通的 Ajax 相比，使用 FormData 的最大优点就是我们可以异步上传二进制文件。
话不多说直接上代码：
var formData = new FormData();
formData.append("template", that.template);
formData.append("declare", that.declareData.declare);
formData.append("self_intro", that.declareData.self_intro);
formData.append("plan_name", that.declareData.plan_name);
//$("#business_plan") 是一个file类型的input对象
formData.append("business_plan", $("#business_plan")[0].files[0]);
var xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
xhr.setRequestHeader("Accept", "application/json");
xhr.send(formData);
// 指定通信过程中状态改变时的回调函数
xhr.onreadystatechange = function () {
// 通信成功时，状态值为4
var completed = 4;
if (xhr.readyState === completed) {
if (xhr.status === 200) {
// 处理服务器发送过来的数据
var result = JSON.parse(xhr.responseText);
//这里你可以随意的处理这个result对象了
//...
} else {// 处理错误
alert("连接超时");
}
}
};
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/78999.html
摘要：简介业务做一个在线投票，给歌手投票。提交到当前页面的中达到效果。用户名密码注册总结在不使用对象的情况下，依然可以用来实现对后台服务器的请求，同时不带来页面刷新或者跳转。 ajax 简介 业务：做一个在线投票，给歌手投票。要求：无刷新，并且不允许使用XMLHttpRequest对象.分析:在XHR对象，没有流行之前，已经有了无刷新这种效果的方法. 从http角度看，可以利用204 No...
摘要：在表单提交时，浏览器会自动进行一系列的校验工作，没有通过校验的表单是无法提交到服务器的。而方法提交表单，会在请求中发送表单字段键值对。表单提交事件表单提交到服务器时，会触发事件。 上一篇主要温习了一下form表单的属性和表单元素，这一片主要讲解用JavaScript如何操作form。 表单操作 取值 用JavaScript操作表单，免不了会有取值赋值操作，比如有以下表单： ...
阅读 444·2021-07-25 21:37
阅读 3446·2019-08-30 15:55
阅读 2411·2019-08-30 15:54
阅读 1595·2019-08-30 15:44
阅读 2998·2019-08-30 15:44
阅读 748·2019-08-30 15:43
阅读 913·2019-08-29 15:36
阅读 2928·2019-08-29 10:58
