FormData 数据转化为 json 数据

简介: 两种方法 用户: 密码: // 版本二(箭头语法)var convert_FormData_to_json2 = function (formData) { var objData = {}; formData.

两种方法

<!-- 实例:将 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>

效果图

打开浏览器控制台

目录
相关文章
|
7月前
|
JSON JavaScript 数据格式
JS 将 json 对象转成字符串并保留格式 - JSON.stringify()
JS 将 json 对象转成字符串并保留格式 - JSON.stringify()
230 0
|
6月前
|
JSON JavaScript IDE
JSON 数据格式化方法
JSON 数据格式化方法
131 3
|
4月前
|
存储 JSON JavaScript
什么是json?json可以存放在哪几种数据类型?在什么时候用?
什么是json?json可以存放在哪几种数据类型?在什么时候用?
56 0
|
7月前
|
JSON JavaScript 前端开发
JSON.stringify() 的 5 种使用场景
JSON.stringify() 的 5 种使用场景
58 0
|
7月前
|
JSON 算法 JavaScript
JSON比较:如何轻松判断数据格式是否相同?
JSON比较:如何轻松判断数据格式是否相同?
380 0
|
JSON 编解码 JavaScript
工银e生活开发脱坑日志(8)使用json_decode无法解析json,双引号才是json 的标准
工银e生活开发脱坑日志(8)使用json_decode无法解析json,双引号才是json 的标准
91 0
|
JSON JavaScript 前端开发
|
JSON 数据格式
json日期格式化与json日期转化为对象
json日期格式化与json日期转化为对象
328 0
json日期格式化与json日期转化为对象
|
XML JSON JavaScript
JSON封装数据和解析数据(一)
JSON封装数据和解析数据
509 0
JSON封装数据和解析数据(一)
|
JSON 数据格式
JSON封装数据和解析数据(2)
JSON封装数据和解析数据
189 0