两种方法

<!-- 实例:将 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. 常用的第三方模块 psutil url

    psutil 用Python来编写脚本简化日常的运维工作是Python的一个重要用途.在Linux下,有许多系统命令可以让我们时刻监控系统运行的状态,如ps,top,free等等.要获取这些系统信息, ...

  2. Vue 2.0 v-for 响应式key, index及item.id参数对v-bind:key值造成差异研究

    Vue 2.0 v-for 响应式key, index及item.id参数对v-bind:key值造成差异研究 在github上阅览README.md以获得最佳阅读体验,点这里 v-for响应式key ...

  3. Oracle EBS 新增 OAFM 个数

    在 $INST_TOP/ora/10.1.3/opmn/conf/opmn.xml中 找到 <process-type id="oafm" module-id="O ...

  4. 华为Eudemon 100E的密码恢复

    华为Eudemon 100E的密码恢复 转自http://blog.sina.com.cn/s/blog_53835f380100hdc3.html  为了让自己下次能记住 Eudemon 100E系 ...

  5. [cb]UIGrid+UIStretch的自适应

    自适应需求 如下图所示:一个Grid下面有六个Button,它们需要在不同的分辨下拉伸适应(Horizontal)宽度,以保证填充满底部 要点分析 首先有这两个要点 1.UIGrid中的Cell Wi ...

  6. Win7下的C盘重新划分为两个盘

    Win 7分盘 注意事项:操作之前,先备份好重要数据,以免误操作导致数据丢失 . 方法步骤如下: 1.在桌面右键点击"计算机"-"管理": 2.鼠标左键单击选& ...

  7. CentOS6源码安装vim8

    CentOS6源码安装vim8 vim8相比vim7多了很多功能. 不过需要源码来进行安装. 移除旧版本的vim yum remove vim 安装依赖库 sudo yum install -y ru ...

  8. SQL server权限管理和备份实例

    权限设置: 1.创建用户zhangsan,并赋予zhangsan有dbcreator的服务器权限. 2.使用zhangsan登录,测试能否创建数据库. 3.使用sa用户附加myschool数据库,设置 ...

  9. 乘风破浪:LeetCode真题_026_Remove Duplicates from Sorted Array

    乘风破浪:LeetCode真题_026_Remove Duplicates from Sorted Array 一.前言     我们这次的实验是去除重复的有序数组元素,有大体两种算法. 二.Remo ...

  10. 4星|《行为设计学:掌控关键决策》:影响决策质量的四大思维陷阱及WRAP应对法

    行为设计学:掌控关键决策 两位作者认为,有四大思维陷阱让人做出错误的决策:思维狭隘.证实倾向.短期情绪.过度自信.两位作者提出WRAP决策流程来应对:Widen your options(拓宽选择空间 ...