FormData对象,使得我们可以在AJAX异步请求中,实现原先HTML表单自动封装数据并提交的能力。它的实现方式也非常简单。
1. 表单属性非常干净,没有了action、method、enctype,需要注意的是要提交表单项的name是必须的
<form id="form"> <p>姓名:<input type="text" name="name"></p> <p>年龄:<input type="text" name="age"></p> <p><input type="button" value="提交" onclick="sub()"></p> </form> 2. 表单的ajax发送 function sub() { var form = document.getElementById('form'); var formdata = new FormData(form); // 将表单元素对象传入 var xhr = new XMLHttpRequest(); xhr.open('post', 'http://localhost:3000/formData'); // 必须采用post xhr.send(formdata); // 发送Formdata对象 xhr.onload = function() { console.log(xhr.responseText); }; } 3. 观察发送的request4. 小结,通过观察Content-Type,FormData对象天然支持文件上传
标签:form,对象,FormData,奇妙,表单,xhr,var From: https://www.cnblogs.com/c431/p/16905748.html