JavaScript 封装表单数据为 JSON 并 AJAX 提交
作者:纸飞机时间:2026-10-22 01:54:43浏览:217
本文介绍如何使用 JavaScript 和 jQuery 将 HTML 表单数据封装为标准 JSON 格式,并通过 AJAX 异步提交。核心代码通过 serializeArray 获取字段,处理同名参数数组,最终生成 JSON 对象供 AJAX 使用,适用于需要结构化数据提交的场景。
表单数据 JSON 封装与 AJAX 提交示例
本文主要讲解如何利用 JavaScript 将 HTML 表单(form)中的数据封装为 JSON 字符串,并通过 AJAX 技术进行提交。
以下是实现该功能的核心 JavaScript 代码。
function getFormJson(frm) { //frm:form表单的id
var o = {};
var a = $("#"+frm).serializeArray();
$.each(a, function() {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [ o[this.name] ];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
}
该函数返回的数据格式符合标准 JSON 规范。在 AJAX 请求中,可直接使用如下方式调用:
$.ajax({
type: 'post',
url: 'your url',
data: getFormJson(frm),
success: function(data) {
// your code
}
});
希望以上内容能对大家有所帮助,感谢阅读及对本网站的支持!
作者最新文章
JS动态构建复杂嵌套JSON对象的方法
2026-11-05 15:41:52
JS负数取余为什么是负数?详解余数与模运算区别
2026-11-05 13:34:41
JS 解压出现乱码或报错怎么解决?
2026-11-05 12:32:38
JS 中 startsWith、indexOf 与正则判断字符串前缀的对比
2026-11-04 22:19:43
JS解析Excel后怎么将数据转换为JSON格式
2026-11-04 20:58:28
