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实现点击 ...
随机推荐
- jpetStore 学习总结(1)
最近学习了Springmvc4,对官方的例子jpetStore进行了分析研究,在官方网站下载spring-framework-2.5.6.SEC03,其中samples文件夹里就有jpetstore的 ...
- Redis学习笔记(6)——SpringDataRedis入门
一.SpringDataRedis简介 Spring-data-redis是spring大家族的一部分,提供了在srping应用中通过简单的配置访问redis服务,对reids底层开发包(Jedis, ...
- python学习,day4:生成器
1.生成器:只有在调用是才会生成相应的数据.(比较省内存,它只保留当时生成的.而列表会保存整个列表) a = [i*2 for i in range(10)] #列表生成式 print(a) 这样会把 ...
- jackson构建复杂Map的序列化
1.序列化复杂的Map时,可能需要下面的方式 import com.fasterxml.jackson.databind.JavaType; import com.fasterxml.jackson. ...
- 安装nagios出现的错误
最近安装nagios时,检查的的状态都没有什么问题,就是监控系统的状态显示不出来 检测的结果如下: [root@lb02 ~]# /etc/init.d/httpd start Starting ht ...
- python 进程和线程(代码知识部分)
二.代码知识部分 一 multiprocessing模块介绍: python中的多线程无法利用多核优势,如果想要充分地使用多核CPU的资源(os.cpu_count()查看),在python中大部分情 ...
- Jexus进程守护工具jws.guard
一个运行中的进程,难免会因为各种各样的原因无缘无故的宕掉(比如网站瞬间的负载过高.内存不足等),而Jexus宕掉的后果往往只有一个:对外提供服务的网站无法访问了.因此,我们需要最大限度的保障我们的网站 ...
- (转)CentOS 7 下 MySQL 5.7 配置 Percona Xtrabackup
CentOS 7 下 MySQL 5.7 配置 Percona Xtrabackup 原文:http://qizhanming.com/blog/2017/05/10/install-percona- ...
- redis 数据持久化 aof方式
redis持久化-Append-only file(缩写aof)的方式 本质:把用户执行的每个 ”写“ 指令(增加.修改.删除)都备份到文件中,还原数据的时候就是执行具体写指令. 打开redis的运 ...
- JS检测数据类型
如果你要判断的是基本数据类型或JavaScript内置对象,使用toString: 如果要判断的时自定义类型,请使用instanceof. 1.typeof typeof操作符返回的是类型字符串,它的 ...