JQuery 获取form表单数据，并转换json数据提交

最新推荐文章于 2025-06-19 11:00:39 发布

Wang_Lan_Jun

最新推荐文章于 2025-06-19 11:00:39 发布

阅读量7.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： js

本文链接：https://blog.youkuaiyun.com/wlj_wangjun/article/details/93858102

js 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种使用jQuery简化表单数据处理的方法，通过自定义serializeObject函数，可以将表单元素的数据轻松转换为JSON格式，便于进行AJAX请求。此方法特别适用于需要收集复选框、单选按钮等复杂表单数据的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/**
 * 初始化  serializeObject
 */
function initSerializeObject() {
    $.fn.serializeObject = function () {
        var o = {};
        var a = this.serializeArray();
        $.each(a, function () {
            if (o[this.name]) {
                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;
    };
}

function submit(){
    // 初始化 序列化对象的方法
    initSerializeObject();
    //获取 from表单的数据
    let jsonData = $("#from-appointment").serializeObject();
    $.ajax({
            type: "post",
            url: "",
            contentType: "application/json; charset=utf-8",
            cache: false,
            async: false,
            data: JSON.stringify(jsonData), //转换成json数据
            success: function (resultData) {
                
            }
        });
}