两种方法

<!-- 实例:将 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. android 所有焦点问题

    一. 主动获取焦点 setFocusable(true);    //  是设置能否获得焦点而已.. requestFocus();          //是让控件得到焦点 requestFocusI ...

  2. 70部MAYA灯光材质渲染教程合集

    MAYA灯光材质渲染教程合集 教程格式:MP4和flv 两种格式 使用版本:教程不是一年出的教程,各个版本都有 (教程软件为英文版) 清晰度:可以看清软件上的文字 语言:部分中文字幕,其他英文(通过看 ...

  3. MySQL 性能监控4大指标——第二部分

    [编者按]本文作者为 John Matson,主要介绍 mysql 性能监控应该关注的4大指标. 第一部分介绍了前两个指标:查询吞吐量与查询执行性能.本文将继续介绍另两个指标:MySQL 连接与缓冲池 ...

  4. JS中的“==”符号及布尔值转换规则

    what are the rules for how == converts types? 关于"=="的比较规则: 1. Comparing numbers and string ...

  5. JSP 过滤器

    JSP教程 - JSP过滤器 JSP过滤器是可用于拦截来自客户端的请求或处理来自服务器的响应的Java类. 过滤器可用于执行验证,加密,日志记录,审核. 我们可以将过滤器映射到应用程序部署描述符文件w ...

  6. COCOMOII

    一.COCOMOII是什么 cocomo是 COnstructive COst MOdel(建设性成本估算模型)的缩写.最早是由Dr. Barry Boehm在1981年提出.是一种精确的.易于使用的 ...

  7. SQL Server 子查询错误:No column name was specified for column 2 of 'a' error (转载)

    问: I have a MySQL query and I ran it working fine but same query showing error in SQL Server. SQL Se ...

  8. eclipse neon配置tomcat8无法显示默认页面解决方法

    下载对应tomcat8版本到本地后,在eclipse中添加tomcat8的对应目录,输入http://localhost:8080时无法显示tomcat的index.jsp页面(会显示404页面).原 ...

  9. ln 硬链接介绍

    硬链接:在linux文件系统中多个文件名指向同一个索引节点(Inode)是正常允许的.硬链接文件就相当于文件的另一个入口. 硬链接的作用:允许一个文件拥有多个有效路径(多个入口),这样用户就可以建立硬 ...

  10. 一起学习Boost标准库--Boost.StringAlgorithms库

    概述 在未使用Boost库时,使用STL的std::string处理一些字符串时,总是不顺手,特别是当用了C#/Python等语言后trim/split总要封装一个方法来处理.如果没有形成自己的com ...