FormData js对象的介绍和使用
FormData js对象的介绍和使用
FormData对象,可以把所有表单元素的name与value组成一个queryString,提交到后台。 在使用ajax提交时,使用FormData对象可以减少拼接queryString的工作量(queryString是查询字符串,http查询字符串由url中?后面的值指定)
当页面上的form以GET方式向页面发送请求数据时 (如数据含有不安全字符,则浏览器先将其转换成16进制的字符再传送,如空格被转换成%20时 ) ,web server 将请求数据放入一名为QUERY_STRING的环境变量中。 Request.QueryString 方法是从这一环境变量中取出相应的值,并将被转成16进制的字符还原
FormData
1. 概述
FormData 对象的使用:
1.用一些键值对来模拟一系列表单控件:即把form中所有表单元素的name与value组装成
一个queryString
2. 异步上传二进制文件。
2、属性
1. FormData对象的操作方法,可以在原型中查看

3、用法
创建一个formData对象实例有几种方式
1、创建一个空对象实例
var formData = new FormData();
此时可以调用append()方法来添加数据
2、使用已有的表单来初始化一个对象实例
假如现在页面已经有一个表单
<form id="myForm" action="" method="post">
<input type="text" name="name">名字
<input type="password" name="psw">密码
<input type="submit" value="提交">
</form>
我们可以使用这个表单元素作为初始化参数,来实例化一个formData对象
// 获取页面已有的一个form表单
var form = document.getElementById("myForm");
// 用表单来初始化
var formData = new FormData(form);
// 我们可以根据name来访问表单中的字段
var name = formData.get("name"); // 获取名字
var psw = formData.get("psw"); // 获取密码
// 当然也可以在此基础上,添加其他数据
formData.append("token","kshdfiwi3rh");
(文章参考自:https://segmentfault.com/a/1190000012327982 https://blog.csdn.net/saharalili/article/details/79002568)
FormData js对象的介绍和使用的更多相关文章
- js中关于Blob对象的介绍与使用
js中关于Blob对象的介绍与使用 blob对象介绍 一个 Blob对象表示一个不可变的, 原始数据的类似文件对象.Blob表示的数据不一定是一个JavaScript原生格式 blob对象本质上是 ...
- Jquery第一篇【介绍Jquery、回顾JavaScript代码、JS对象与JQ对象的区别】
什么是Jquery? Jquey就是一款跨主流浏览器的JavaScript库,简化JavaScript对HTML操作 就是封装了JavaScript,能够简化我们写代码的一个JavaScript库 为 ...
- JS 对象封装的常用方式
JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...
- jQuery对象入门级介绍
你是否曾经见过像 $(".cta").click(function(){})这样的JavaScrip代码?或许你还会思考下 $('#X') 是什么,如果看到这些你都觉得摸不着头脑 ...
- js对象,原型,call,apply浅析
//对象直接量,创建对象最简单的方式是在js里使用对象直接量 var book = { "main title": "js", //属性里有空格,要用引号 &q ...
- DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢,而是说操作了这个对象后,会触发一些浏览器行为(转)
一直都听说DOM很慢,要尽量少的去操作DOM,于是就想进一步去探究下为什么大家都会这样说,在网上学习了一些资料,这边整理出来. 首先,DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢 ...
- JSON字符串和JS对象
JSON和JS对象 一 JSON是什么 JSON是基于文本的,轻量的,用于数据交换的,一种格式. 可以看到JSON的定义里面有很多的定语,现在就每个限定解释一下: 1. 基于文本 这里的意思是相对于哪 ...
- 从零开始学习前端JAVASCRIPT — 4、JavaScript基础Math和Date对象的介绍
Math对象的介绍 1:Math对象 Math 对象用于执行数学任务.并不像 Date 和 String 那样是对象的类,因此没有构造函数 Math().您无需创建它,通过把 Math 作为对象使用就 ...
- jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象
这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...
随机推荐
- Python2获取网页标题
Python获取网页标题 使用Python2.x的urllib2和lxml,速度应该还快于BeautifulSoup4(话说回来,为什么大家都要用BS4呢?一个XPATH不就完了吗) 没有安装过的,用 ...
- 内核诊断(二)-- patch 和diff
patch文件结构 生成patch文件 --diff命令 patch 使用 -- patch命令 3.1 打path 3.1撤销patch 使用举例 4.1 基本命令使用 4.2 内核打补丁 1. p ...
- 第1章—Spring之旅—容纳你的Bean
容纳你的Bean 在基于Spring的应用中,你的应用对象生存于Spring容器中.Spring负责创建对象,装配他们,配置他们并管理他们整个生命周期,从生存到死亡(在这里 可能是new 到 fina ...
- ubuntu手动安装PhantomJS
1.切换到主目录:cd ~2.下载安装包:https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-Linux-x86_64.ta ...
- ListView性能优化——convertView&viewHolder
ListView优化大致从以下几个角度:1.复用已经生成的convertView:2.添加viewHolder类:3.缓存数据(图片缓存):4.分页加载. 具体方案: 1.如果自定义适配器,那么在ge ...
- python笔记03-----文件操作
文件操作 创建一个文件名字为filename 内容是 BJSHGDTW 打印文件编码 f = open("filename",'r',encoding="utf-8&qu ...
- Ubuntu系统Java开发环境的搭建
操作系统:Linux x64 / Ubuntu 14.04 Java JDK版本:jdk-8u65-linux-x64.tar.gz 声明:转载请注明出处及本文链接 本文原文地址:Ubuntu系统Ja ...
- Java设计模式-监听器模式
监听器模式有三个要素——事件源.事件对象.监听器. 事件源:顾名思义,事件发生的源头,比如点击的按钮,属于被监听的对象: 事件对象:这个经常和事件源混淆,它经常被用来包装事件源,切记,它毕竟是个事件, ...
- 证书透明度Certificate Transparency
发现使用google浏览器访问HTTPS网址时,点击小锁-->>连接-->>有一项服务器未提供任何 certificate transparency 信息?只有google浏览 ...
- HTTPS的误解(一)
大家好,SSL证书越来越受到人们的关注,经常有人会说HTTPS只有登录页才需要,而且会使网站速度下降,易维信(EVTrust)给大家澄清了一些HTTPS协议容易产生误解的地方,增长一些网页加密通信的知 ...