时间:2021-05-26
关于FormData
XMLHttpRequest Level 2添加了一个新的接口 ---- FormData
利用FormData对象,可以通过js用一些键值对来模拟一系列表单控件,可以使用XMLHttpRequest的 send( ) 方法来异步提交表单与普通的ajax相比,使用FormData的最大优点就是可以异步上传二进制文件
FormData对象
FormData对象,可以把所有表单元素的name与value组成一个queryString,提交到后台。 在使用ajax提交时,使用FormData对象可以减少拼接queryString的工作量
queryString是查询字符串,http查询字符串由url中?后面的值指定
当页面上的form以GET方式向页面发送请求数据时 (如数据含有不安全字符,则浏览器先将其转换成16进制的字符再传送,如空格被转换成%20时 ) ,web server 将请求数据放入一名为QUERY_STRING的环境变量中。 Request.QueryString 方法是从这一环境变量中取出相应的值,并将被转成16进制的字符还原
使用FormData上传文件、图片
创建一个FormData空对象,然后使用append方法添加key/value
var formdata=new FormData(); formdata.append ("name" , "张三");如果已经有一个Form表单,取得form对象,作为参数传入FormData对象
<!DOCTYPE html><html><head> <meta charset="utf-8"/> <title></title></head><body> <form name="form1" id="form1"> <input id="file" type="file" name="name"></input> </form> <script type="text/javascript"> var form=document.getElementById("form1"); var formdata=new FormData(form); </script></body></html>可以在已有表单数据的基础上,继续添加新的键值对
使用FormData对象上传文件
var formdata=new FormData($("#form1").[0]);//获取文件法一//var formdata=new FormData( ); //formdata.append("file" , $("#file")[0].files[0]);//获取文件法二 $.ajax({ type : 'post', url : '#', data : formdata, cache : false, processData : false, // 不处理发送的数据,因为data值是Formdata对象,不需要对数据做处理 contentType : false, // 不设置Content-type请求头 success : function(){} error : function(){ } })以上所述是小编给大家介绍的JS中使用FormData上传文件、图片的方法的全部叙述,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言!
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
使用FormData上传文件时,总是获取不到req.file对象。发现是没有配置对FormData导致。这里我是在vue中使用axios发送的请求,配置代码如下
本文实例讲述了JS+php后台实现文件上传功能。分享给大家供大家参考,具体如下:一、利用FormData对象形式上传FormData是XMLHttpReques
摘要1.jquery自定义插件方法2.表单file样式调整3.利用formData,ajax上传图片4.js,css弹出层5.springmvc上传图片效果调用
html页面//注意不能带括号js代码methods:{//上传图片onUpload(e){varformData=newFormData();formData
本文实例讲述了php+html5使用FormData对象提交表单及上传图片的方法。分享给大家供大家参考。具体分析如下:FormData对象,可以把form中所有