星空网 > 软件开发 > Java

使用FormData上传文件、图片

关于FormData

  • 利用FormData对象,可以通过js用一些键值对来模拟一系列表单控件,可以使用
  • 与普通的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上传文件、图片

  1. 创建一个FormData空对象,然后使用append方法添加key/value
    var formdata=new FormData(); formdata.append ("name" , "张三");

  2. 如果已经有一个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>   

  3. 可以在已有表单数据的基础上,继续添加新的键值对
    var formdata=new FormData(); formdata.append ("age" , "21");

  4. 使用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(){ }       })

     

 




原标题:使用FormData上传文件、图片

关键词:上传

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

实操|listing图片如何优化?:https://www.ikjzd.com/articles/117940
实操|listing文案应该如何优化?:https://www.ikjzd.com/articles/117941
教程|A+页面怎么设计?:https://www.ikjzd.com/articles/117942
三个重要步骤,教你在Shopify上建立自己的品牌:https://www.ikjzd.com/articles/117943
跨境电商“黑五”表现强势,实体店铺风光不再:https://www.ikjzd.com/articles/11795
克扣工资!逼迫离职!深圳某铺货大卖额恶心操作!:https://www.ikjzd.com/articles/117950
2024.04.18亚马逊选品推荐(仅供参考):女装蛋糕连衣裙:https://www.kjdsnews.com/a/1842234.html
欧洲市场疯了,订单排到7、8月!:https://www.kjdsnews.com/a/1842235.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流