jquery.form

jquery.form插件（）是大家经常会用到的一个jQuery插件，它可以很方便将表单转换为ajax的方式进行提交。以下是官网给出的一个栗子：

$(document).ready(function() {

var options = {

target: '#output1', // target element(s) to be updated with server response

beforeSubmit: showRequest, // pre-submit callback

success: showResponse // post-submit callback

};

$('#myForm1').ajaxForm(options);

});

function showRequest(formData, jqForm, options) {

var queryString = $.param(formData);

alert('About to submit: \n\n' + queryString);

return true;

}

function showResponse(responseText, statusText, xhr, $form) {

alert('status: ' + statusText + '\n\nresponseText: \n' + responseText +

'\n\nThe output div should have already been updated with the responseText.');

}

再看以下需求：

假设我想在用户点击submit按钮的时候，对表单中的某些数据进行动态的修改，例如要对密码字段进行加密处理，然后才发送给服务器。这时候，我们可能想到可以在beforeSubmit的回调函数（showRequest）中进行处理，例如像这个样子：

function showRequest(formData, jqForm, options) {

var jform = jqForm[0];

var password= jform.password.value;

password=encrypt(password); //加密密码

$("#password").val(password);

alert($("#password").val()); //检验一下输入框的内容是否发生了改变

return true;

}

通过上面的代码，我们提交表单的时候很顺利弹出了我们期待的加密后的密码，表明表单内容已经被我们成功修改，但当我们以为一切都很顺利的时候，发现提交到服务器的密码依然是没有加密的密码？咋回事？？

原因是：我们的修改晚了！！

因为，在执行beforeSubmit之前，jquery.form已经完成了表单数据的串行化处理，也就是说，你无论如何修改表单内容，其实都不影响串行化的结果。（就是jquery.ajax方法中的data数据）

那么，有没有办法呢？当然有啦，因为jquery.form早就为我们准备了另一个回调接口：beforeSerialize

我们只要将上述修改表单数据的过程挪到beforeSerialize的回调函数中，就可以在表单串行化之前对数据进行动态的修改。

看一下官网的表述：

beforeSerialize

Callback function to be invoked before the form is serialized. This provides an opportunity to manipulate the form before it's values are retrieved.

beforeSubmit

Callback function to be invoked before the form is submitted. The 'beforeSubmit' callback can be provided as a hook for running pre-submit logic or for validating the form data. If the 'beforeSubmit' callback returns false then the form will not be submitted.

很清楚看到，beforeSerialize可以在表单的数值被获取之前对数据进行处理。而beforeSubmit则是在提交之前对已经获取的数据进行校验。