jQuery表单提交插件的formSerialize、fieldSerialize、fieldValue、resetForm、clearForm、clearFields的应用

一、jQuery Form的其他API。

1.formSerialize

将表单序列化为查询字符串。此方法将返回以下形式的字符串：name1=value1name2=value2。能不能串联打：不，这个方法返回一个字符串。

示例：

var queryString=$('#myFormId ')。formSerialize()；//现在可以使用$提交数据。得到，$。邮政，美元。ajax等$。post('myscript.jsp '，query string)；2.fieldSerialize

将表单中的元素序列化为字符串。当您只需要序列化表单的某些元素时，可以使用此方法。此方法将返回以下形式的字符串：name1=value1name2=value2。能不能串联打：不，这个方法返回一个字符串。

示例：

var queryString=$('#myFormId。特殊领域’)。field Serialize()；3.fieldValue

取出符合要求的所有字段的值，并将其作为数组返回。从0.91版本开始，这个方法总是返回一个数组。如果没有匹配的字段，数组将为空，否则它将至少包含一个值。能不能串联打：否，此方法返回一个数组。示例：

//获取密码输入var值的值=$('#myFormId :password ')。field value()；警报('密码是： '值[0])；4.resetForm

通过调用表单元素的内部DOM上的方法，将表单重置为其原始状态。能否串联调用就是：的一个例子。

$('#myFormId ')。reset form()；5.clearForm

清空表单所有元素的值。此方法将清除文本框、密码框和文本框中的所有值，删除下拉列表中的所有选定项，并使复选框和单选框中的所有选定项不再被选中。我可以串联打：吗？号码

$('#myFormId ')。clearForm()；6.clearFields

清空表单域的值。当只需要清除表单中某些元素的值时，可以使用这种方法。我可以串联打：吗？号码

$('#myFormId。特殊领域’)。clearFields()；二、测试的详细代码：

！DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN ' HTML标题jquery Form表单提交插件-表单序列化、字段序列化、字段值、重置表单、清除表单、清除字段的应用/title meta http-equiv=' Content-Type ' Content=' text/html；charset=UTF-8' /！-引入依赖的js-script src=' http : jquery-1。3 .1 .js ' type=' text/JavaScript '/script script src=' http : jquery。形式。js ' type=' text/JavaScript '/script script type=' text/JavaScript ' $(文档)。ready(function() { $('#test ')).单击(function(){ var查询字符串=$(“# my form”).formSerialize()；alert(查询字符串)；//组装的数据可以用于$.得到，$。邮政，美元。创建交互式、快速动态网页应用的网页开发技术.$.post('demo.jsp '，queryString，function(data){$('#output1 ')).html(")提交成功！欢迎下次再来！').show()；});返回false})//demo2$('#test2 ').单击(function(){ var查询字符串=$(“#我的表单2 *”).字段值()；alert(查询字符串)；返回false})//重置表单$('#test3 ').单击(函数(){$('#myForm ')).重置表单()；$('#myForm2 ').重置表单()；})//清除表单$('#test4 ').单击(函数(){$('#myForm ')).clearForm()；$('#myForm2 ').clearForm()；})});/script/head dyh 3演示3 : jQuery表单表单提交插件-表单序列化、字段序列化、字段值、重置表单、清除表单、清除字段的应用/h3！- demo1 -表单id='myForm '操作='demo.jsp '方法='post '名称：输入类型='text' name='name'/br/地址：输入类型=“文本”名称='address' /br/自我介绍：文本区域名称='注释'/文本区域br/输入类型=' submit ' id=' test ' value='提交/br/div id=' output 1 ' style=' display : none；/div/formbr/br/br/！- demo2 -表单id='myForm2 '操作='demo.jsp '方法='post '名称：输入类型=' text ' name=' name 2 ' class=' special '/br/地址：输入类型='text' name='address2' /br/自我介绍：文本区域名称=' comment 2 ' class=' special '/文本区域br/单选：男输入类型='收音机'名称='a '值='男选中/女输入类型='收音机'名称='a '值='女/br/输入类型='submit' id='test2' value='提交/br//formbr/br/br/输入类型='button' id='test3' value='重置所有表单/br/输入类型='button' id='test4' value='清除所有表单'/(提示：发现单选框以前选中的，也被清除了，跟重置有点区别！)br//body/htmldemo.jsp代码

“% @”页面语言=“Java”导入=“Java”。乌提尔。*”页面编码=“UTF-8”% %请求。setcharacter encoding(' UTF-8 ')；//防止乱码！字符串名称=请求。getParameter(' name ')；字符串地址=请求。GetParameter(' address ')；字符串注释=请求。GetParameter('注释')；系统。出去。println(名称' '地址')注释);%三、测试效果：

1.formSerialize()测试效果：

空的时候：

填写英文的时候：

填写中文的时候：

2.fieldValue()测试效果：

空值的时候：

填写英文的时候：

填写中文的时候：

3.resetForm()的测试效果

重置前：

重置后：

4.clearForm()方法的效果：

清除前效果：

清除后效果：