两种方法

<!-- 实例:将 FormData 转化为 json -->

<meta charset="utf-8"/>

<form enctype='application/json' method="post">
<label>用户:</label>
<input type="text" name="user"></br>
<label>密码:</label>
<input type="texteara" name="password"></br> <input type="submit" value="提交">
</form> <script> // 版本二(箭头语法)
var convert_FormData_to_json2 = function (formData) {
var objData = {}; formData.forEach((value, key) => objData[key] = value); return JSON.stringify(objData);
}; // 版本一
var convert_FormData_to_json = function (formData) {
var objData = {}; for (var entry of formData.entries()){
objData[entry[0]] = entry[1];
}
return JSON.stringify(objData);
}; // 显示根据Form生成的json数据
var formobj = document.querySelector('form');
formobj.addEventListener('submit', function(event){
event.preventDefault(); console.log(convert_FormData_to_json(new FormData(formobj)));
console.log(convert_FormData_to_json2(new FormData(formobj))); }, false);
</script>

效果图

打开浏览器控制台

FormData 数据转化为 json 数据的更多相关文章

  1. 将Dictionary序列化为json数据 、json数据反序列化为Dictionary

    需要引用System.Web.Extensions  dll类库 /// <summary> /// 将json数据反序列化为Dictionary /// </summary> ...

  2. JSONArray ja = JSONArray.fromObject(list);//特殊类 用于将list转化为JSON 数据并返回 out.print(ja);

    JSONArray ja = JSONArray.fromObject(list);//特殊类 用于将list转化为JSON 数据并返回out.print(ja);

  3. 把数据转化为JSON格式用ajax进行前后端交互

    接着在https://www.cnblogs.com/dong973711/p/10907733.html的基础上做验证. 从前端提交数据 前端页面,submit.html <!DOCTYPE ...

  4. 用ajax获取后台数据,返回json数据,怎么在前台使用?

    用ajax获取后台数据,返回json数据,怎么在前台使用呢?后台 C# code   ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == &qu ...

  5. Jquery Ajax和getJSON获取后台普通Json数据和层级Json数据解析

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 玩转Web之Json(三)-----easy ui怎么把前台显示的dataGird中的所有数据序列化为json,返回到后台并解析

    最近做一个项目时,需要在dataGird中插入<input>,即文本输入框,当点击提交时,需要把文本框里填的数据返以及其他列的一些信息以json数组的格式返回到后台,虽然我实现了该功能,但 ...

  7. php array转化为utf-8编码以便于转化为json数据

    php中转化为json时,字符串或数组编码必须为utf-8编码. 在网上找到了一个方法可以比较简单的转化,在此记录: 利用var_export()和eval()方法var_export():输出或返回 ...

  8. XML 数据请求与JSON 数据请求

    (1)XML 数据请求 使用 AFNetworking 中的 AFHTTPRequestOperation 和 AFXMLParserResponseSerializer,另外结合第三方框架 XMLD ...

  9. js声明json数据,打印json数据,遍历json数据

    1.js声明json数据: 2.打印json数据: 3.遍历json数据 //声明JSON var json = {}; json.a = 1; //第一种赋值方式(仿对象型) json['b'] = ...

随机推荐

  1. C语言中数据类型的本质

    数据类型可以理解为固定内存大小的别名.比如int类型,就是表示占用4字节的内存. 1 数据类型的大小 用sizeof操作符获得数据类型的大小. 比如 int a[5];   sizeof(a)就可以得 ...

  2. TreeView失去焦点时亮显选中状态

    Windows Form下设置属性即可. TreeView.HideSelection = false

  3. .NET Dispose模式的实现

    以下是代码: /// <summary> /// Dispose Pattern /// </summary> /// <remarks> /// 由逻辑可知: / ...

  4. extends CakeRequest,重写is方法

    背景:Cakephp开发环境版本是2.3.8,服务器的cakephp版本是2.3.5,测试好的代码上传到服务器上后发现总爆如下的警告: Warning (2): strtolower() expect ...

  5. 免安装PostgreSQL启动服务及创建数据库

    安装环境windows7 64位系统 免安装版本postgresql-10.3-1-windows-x64-binaries ===================================== ...

  6. python自定义函数和推导

    #之所以把这俩写一起,并不是因为这俩有什么关系,因为都太简单,没什么可说的 #自定义函数的格式,def开头,后面空格,在后面是函数名,接括号,括号里是入参参数 #!/usr/bin/python # ...

  7. 64位Windows的Dos中取消了edit命令

    前段时间在玩dos命令行的时候,用copy con创建了txt文件后想对其进行编辑,然后我又不想用记事本,所以去网上找命令行中对文本文件进行编辑的命令(纯属想装B),结果看到了edit命令. 一敲,就 ...

  8. gl 绘制多边形的函数解析 分类: OpenGL(转)

    http://blog.csdn.net/zhongjling/article/details/7528091 1,所谓正反面 glFrontFace(GL_CCW);  // 设置CCW方向为“正面 ...

  9. 自定义上传控件(兼容IE8)

    上传控件是 <input type="file"/> 而实际开发过程中,都会自定义一个控件,因为这个控件本身难看,而且不同浏览器效果不一样. 如IE8显示如下: 谷歌浏 ...

  10. Beta版本项目计划

    小队名称:PHILOSOPHER 小组成员 [组长]金盛昌(201421122043).刘文钊(20142112255).陈笑林(201421122042) 张俊逸(201421122044).陈志建 ...