JavaScript序列化form为对象和JSON

  前端提交参数给后端时,通常是用json格式做传递,而接收输入参数的控件一般都用form表单,有没有办法可以将form里的参数直接序列化成对象呢,以下提供了一种方法:

    function deserializeJSON($form) {
        var res = {};
        $.each($form.serializeArray(), function() {
            res[this.name] = this.value;
        });
        return res;
    };

    function serializeJSON($form) {
        return JSON.stringify(deserializeJSON($form));
    };

  deserializeJSON 方法可以将form里的参数直接序列化成js对象,key为name属性,而value则是对应的value值;

  serializeJSON  方法可将deserializeJSON序列化出来的对象直接转成json串,作为post的data传递给后台。

 比如有个form:

            <form class="passwordForm form form-horizontal" name="passwordForm">
                            <input type="text" class="input-text hidden" value="" placeholder="" name="userId">
                            <div class="row cl">
                                <label class="form-label col-sm-3">原始密码</label>
                                <div class="formControls col-sm-6">
                                    <input type="password" class="input-text" value="" placeholder="" id="oldPassword" name="cellNo">
                                </div>
                            </div>
                            <div class="row cl">
                                <label class="form-label col-sm-3">新的密码</label>
                                <div class="formControls col-sm-6">
                                    <input type="password" class="input-text" value="" placeholder="" id="newPassword" name="userPassword">
                                </div>
                            </div>
                            <div class="row cl">
                                <label class="form-label col-sm-3">确认密码</label>
                                <div class="formControls col-sm-6">
                                    <input type="password" class="input-text" value="" placeholder="" id="newConfirm" name="passwordConfirm">
                                </div>
                            </div>
                        </form>

可以直接写进行传递:

        var formJson = utility.serializeJSON($(".passwordForm"));
        $.ajax({
            url: "/user/change_password",
            type: 'POST',
            timeout: 30000,
            dataType: "json",
            data: formJson,
            contentType: "application/json; charset=utf-8",
            crossDomain: true,
            success: function(data) {
                // 获取结果数据
                var code = data.code;
                if (code == 0) {
                    alert("修改密码成功!");
                } else {
                    alert(data.message);
                }
            },
            error: function() {
                alert("修改密码出错,请稍后操作!");
            }
        });

猜你喜欢

转载自blog.csdn.net/kxiaozhuk/article/details/81744397