- method
请求方式,一般使用get和post - enctype
- application/x-www-form-urlencoded
对所有字符都会进行编码(空格转换为 "+" 加号,特殊符号转换为 ASCII HEX 值) - multipart/form-data
不对字符编码。在使用包含文件上传控件的表单时,必须使用该值 - text/plain
空格转换为 "+" 加号,但不对特殊字符编码 - action
请求地址 - name
设置表单名称
- application/x-www-form-urlencoded
- novalidate
阻止表单默认的验证规则,否则会与开发中的验证规则发生冲突,建议添加 - 阻止表单默认跳转
ev.preventDefault(),但是同时会阻止表单的默认提交- 通过iframe阻止跳转,调用form的submit方法,可以达到提交数据并且不会跳转的目的
<form action="url" target="stop"></form>
<iframe name="stop" style="display:none;"></iframe>
-
form表单提交后,获取后端返回的数据
常见的获取方式是通过jquery的ajaxForm,但是我们往往不会因为一个功能点而去增加项目的重量,这是不合理的,这里我们通过原生来实现这个功能,我们通过iframe阻止跳转是因为我们的form指向了我们的iframe,请求后端后,后端返回数据也就指向了我们的iframe
<form action="url" target="stop"></form>
<iframe name="stop" style="display:none;" id="formData"></iframe>
- javascript
document.queryselect('#formData').onload = function() {
let data = JSON.parse(this.contentWindow.document.body.innerText
}