JavaScript-使用javascript如何将表单数据序列化成json格式?

JavaScript-使用javascript如何将表单数据序列化成json格式?

瑾兮 发布于 2017-10-02 字数 151 浏览 1241 回复 1

我想用javascript将表单所有元素转换成一个json对象,返回的数据不能是字符串,有点类似于jquery中的 serializeArray() 方法,求一个原生的高效的实现方法

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

灵芸 2017-10-12 1 楼

function $() {
var elements = new Array();

for (var i = 0; i < arguments.length; i++) {
var element = arguments[i];
if (typeof element == 'string')
element = document.getElementById(element);
if (arguments.length == 1)
return element;
elements.push(element);
}
return elements;
}
//转换的主要函数
function formToJSON(f)
{
var form=$(f);

json = '{';
isarray = false;
for (i = 0, max = form.elements.length; i < max; i++) {
e = form.elements[i];
name = e.name;
if (name.substring(name.length - 2) == '[]') {
name = name.substring(0, name.length - 2);
lastarr = name;
if (isarray == false) {
json += '"' + name + '":[';
}
isarray = true;
} else {
if (isarray) {
json = json.substring(0, json.length - 1) + '],';
}
isarray = false;
}//end else

switch (e.type) {
case 'checkbox':
case 'radio':
if (!e.checked) { break; }
case 'hidden':
case 'password':
case 'file':
case 'text':
if (!isarray) {
json += '"' + name + '":';
}
json += '"' + e.value.replace(new RegExp('(["\\])', 'g'), '\$1') + '",';
break;

case 'button':
case 'image':
case 'reset':
case 'submit':
default:
}//end switch
};//end for

alert( json.substring(0, json.length - 1) + '}');
}

还有通过JQuery实现的,

(function($) {
/**
* 将form表单中的值转换为json格式
*/
$.fn.formtojson = function() {
var obj={};
var serializedParams = this.serialize();
function evalThem (str) {
var attributeName = str.split("=")[0];
var attributeValue = str.split("=")[1];
if(!attributeValue){
attributeValue = '';
}
var array = attributeName.split(".");
for (var i = 1; i < array.length; i++) {
var tmpArray = Array();
tmpArray.push("obj");
for (var j = 0; j < i; j++) {
tmpArray.push(array[j]);
};
var evalString = tmpArray.join(".");
if(!eval(evalString)){
eval(evalString+"={};");
}
};
eval("obj."+attributeName+"='"+unescape(attributeValue).replace(/'/, "\'")+"';");
};
var properties = serializedParams.split("&");
for (var i = 0; i < properties.length; i++) {
evalThem(properties[i]);
};
return obj;
};

参考资料:纯js/javascript 打造form表单转换为json的方法
将form表单值转换为json数据