在日常开发中，涉及表单的处理司空见惯。过往，在取值和赋值的过程中，借助 jQuery 常常只是逐个控件进行操作，可惜这样开发效率并不高。那么能不能批量获取整个表单的值呢，以及批量为表单赋值。

一、取值、赋值的扩展方法

/* jQuery 扩展 */

jQuery.fn.extend({

    /* 清空表单 */

    formClear: function () {

        this.find("input:text,select,input:hidden,input:password").each(function () {

            $(this).val("");

        });

        this.find("input:checkbox,input:radio").each(function () {

            $(this).removeAttr("checked");

        });

    },

    /* 填充表单 */

    // 例如 $('form').formFill({ data : {id:1} , prefix : "user." })，填充后形如 <input name='user.id' value='1' >

    formFill: function (option) {

        var prefix = option.prefix;

        if (prefix == undefined) prefix = "";

        var frmData = option.data;

        for (i in frmData) {

            var dataKey = i;

            var thisData = this.find("[name='" + prefix + i + "']");

            var text = "text";

            var hidden = "hidden";

            if (thisData != null) {

                var thisDataType = thisData.attr("type");

                var val = frmData[i];

                var isdata = (val != null && val.toString().lastIndexOf("/Date(") != -1);

                if (thisDataType == "radio") {

                    thisData.filter("[value=" + val + "]").attr("checked", "checked")

                    if (val == true || val == "0") val = "True";

                    else if (val == false || val != "0") val = "False";

                    thisData.filter("[value=" + val + "]").not("donbool").attr("checked", "checked")

                } else if (thisDataType == "checkbox") {

                    if (thisData.size() == 1) {

                        if (val == "true" || val == 1 || val == "True" || val == "1") {

                            thisData.attr("checked", "checked");

                        } else {

                            thisData.removeAttr("checked");

                        }

                    } else {

                        thisData.removeAttr("checked");

                        var cbIndex = i;

                        if (val.lastIndexOf(",") == -1) {

                            this.find("[name='" + prefix + dataKey + "'][value='" + prefix + val + "']").attr("checked", "checked");

                        } else {

                            jQuery(val.split(',')).each(function (i, v) {

                                this.find("[name='" + prefix + dataKey + "'][value='" + prefix + v + "']").attr("checked", "checked");;

                            })

                        }

                    }

                } else {

                    if (isdata) {

                        val = jQuery.Convert.jsonReductionDate(val);

                    }

                    if (val == "null" || val == null)

                        val = "";

                    if (val == "" && thisData.attr("watertitle") == thisData.val()) {

                    } else {

                        thisData.val(val + "");

                        thisData.removeClass("watertitle");

                    }

                }

            }

        }

    },

    /* 抓取表单 */

    // changeToBool 设置为true的话，会把string型"true"和"false"字符串值转化为boolean型

    formSerialize: function (changeToBool) {

        var formArray = this.serializeArray();

        var oRet = {};

        for (var i in formArray) {

            if (typeof (oRet[formArray[i].name]) == 'undefined') {

                if (changeToBool) {

                    oRet[formArray[i].name] = (formArray[i].value == "true" || formArray[i].value == "false") ? formArray[i].value == "true" : formArray[i].value;

                }

                else {

                    oRet[formArray[i].name] = formArray[i].value;

                }

            }

            else {

                if (changeToBool) {

                    oRet[formArray[i].name] = (formArray[i].value == "true" || formArray[i].value == "false") ? formArray[i].value == "true" : formArray[i].value;

                }

                else {

                    oRet[formArray[i].name] += "," + formArray[i].value;

                }

            }

        }

        return oRet;

    }

}); // end extend

formClear：清空表单中所有控件的值

$("form#editForm").formClear();

formFill：填充表单所有控件

$("form#editForm").formFill({ data: result.Data });

formSerialize：获取表单中所有控件的值

// 收集表单数据

var serializeForm = $("#searchForm").formSerialize(true);

参数设置为true的话，会把string型的"true"和"false"字符串值转化为boolean型。

如果需要追加额外的属性，使用 extend 合并即可：

$.extend(serializeForm, { openId: openId });

除了上述的合并方式之外，还可以直接为属性赋值，这样 js 语言层面会自动追加属性：

if (serializeForm.hasOwnProperty("IsSubscribeSenderEmail")) {

    serializeForm["IsSubscribeSenderEmail"] = 1;

} else {

    serializeForm["IsSubscribeSenderEmail"] = 0;

}