jQuery表单插件的ajaxForm()和ajaxSubmit()的可选参数项对象

表单插件应用编程接口提供了许多有用的方法，可以让您轻松处理表单中的数据和表单的提交过程。

测试环境：在Tomcat中部署的web项目。

本文演示了jQuery表单插件的ajaxForm()和ajaxSubmit()的可选参数项对象。

ajaxForm()和ajaxSubmit()的可选参数项对象。

AJAX和ajaxSubmit都支持大量可选参数，这些参数通过可选参数项对象传入。可选项对象只是一个简单的JavaScript对象，包含一些属性和一些：的值。

目标

用服务器返回的内容替换指定页面元素的内容。该值可以由jQuery选择器表示，也可以是jQuery对象或DOM元素。默认值：null。

全球资源定位器(Uniform Resource Locator)

提交表单的地址。默认值：表单操作的值。

类型

表单提交方法为“获取”或“发布”。默认值：表单方法的值(如果未指定，将被视为“GET”)。

提交前

提交表单前要执行的方法。这可用于表单提交前的预处理或表单验证。如果“beforeSubmit”指定的函数返回false，则不会提交表单。“beforeSubmit”函数调用带有三个参数：数组形式的表单数据、jQuery对象形式的表单对象以及传递给ajaxForm/ajaxSubmit的可选对象。

数组形式的表单数据采用以下格式：[{name:' username '，value:' jresig'}，{name3360' password '，value:' secret'}]。

默认值：null。

成功

提交表单时执行的功能。如果指定了“成功”回调函数，当服务器返回对表单提交的响应时，将执行此方法。responseText和responseXML的值将被传递到这个参数中(这取决于数据类型的类型)。默认值为空。

数据类型

指定服务器响应返回的数据类型。其中之一是： null、“xml”、“脚本”或“json”。该数据类型选项用于指示如何处理服务器返回的数据。这直接对应于jQuery.httpData方法。

以下选项可用：

Xml':如果dataType=='xml '，服务器返回的数据将被视为Xml，在这种情况下，由' success '指定的回调函数将在responseXML数据中传递。

Json':如果dataType=='json '，服务器返回的数据将被执行并传递到' success '回调函数中。

脚本' :如果dataType=='script '，服务器返回的数据将在上下文中执行。

默认值：null。

语义的

一个布尔值，指示表单中提交的数据顺序是否应该严格按照语义顺序。通常，表单的数据是按语义顺序序列化的，除非表单中有type='image '元素。因此，只有当表单中需要严格的顺序，并且表单中有type='image '时，才有必要对此进行指定。默认值：false。

resetForm

布尔值，指示表单成功提交后是否需要重置。默认值：null。

clearForm

布尔值，指示表单成功提交后是否需要清空。默认值：null。

内联框架

布尔值，指示表单是否需要提交给iframe。当表单中有上传文件的文件字段时，使用此选项。有关更多信息，请参见代码示例页上的文件上传文档。默认值：false。

首先，介绍依赖js。

脚本src=' http : jquery-1 . 3 . 1 . js ' type=' text/JavaScript '/script script src=' http : jquery . form . js ' type=' text/JavaScript '/script网盘下载：https://yunpan.cn/crjzfmXqaTu9e访问密码e3bc。

第二，写页面。

！-demo 1-表单id=' my form ' action=' Ajax 2 . JSP ' method=' post ' name:input type=' text ' name=' name '/br/address:input type=' text ' name=' address '/br/自我介绍：textarename=' comment '/textarebr/input type=' submit ' id=' test ' value=' submit '/br/div id=' output 1 '/div/form iii。调用方法。

脚本类型='text/javascript' $(文档)。ready(function(){ var options={ target : ' # output 1 '，//用服务器返回的数据更新编号为输出一的内容。beforeSubmit: showRequest，//提交前成功：显示响应，//提交后//另外的一些属性： //url: url //默认是形式的行动，如果写的话，会覆盖从的行动//type: type //默认是形式的方法，如果写的话，会覆盖从的方法。("获取"或"发布")。//DataType : null//“XML”，脚本"或“json”(接受服务端返回的类型)//clearForm: true //成功提交后，清除所有的表单元素的值。resetForm: true //成功提交后，重置所有的表单元素的值。//由于某种原因，提交陷入无限等待之中，超时参数就是用来限制请求的时间，//当请求大于3秒后，跳出请求//超时： 3000 }；//“AJax FORm”方式的表单$(“# my form”).ajaxForm(选项);//或者“ajaxSubmit”方式的提交//$('#myForm ').submit(function() { //$(this)).ajaxSubmit(选项);//返回false//来阻止浏览器提交。//});});//提交前函数showRequest(formData，jqForm，options) { //formdata是数组对象，在这里，我们使用$.参数()方法把他转化为字符串var queryString=$ .param(formData)；//组装数据，插件会自动提交数据alert(查询字符串)；//类似：name=1add=2返回true} //提交后函数showResponse(responseText，statusText) { alert('状态："状态文本" \n返回的内容是： \ n ' responseText)；}/脚本四、详细代码：

！DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN ' HTML标题jquery表单插件的使用- ajaxForm()和ajaxSubmit()的可选参数项对象/title meta http-equiv=' Content-Type ' Content=' text/html；charset=UTF-8 '/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(){ var options={ target : ' # output 1 '，//用服务器返回的数据更新编号为输出一的内容。beforeSubmit: showRequest，//提交前成功：显示响应，//提交后//另外的一些属性： //url: url //默认是形式的行动，如果写的话，会覆盖从的行动//type: type //默认是形式的方法，如果写的话，会覆盖从的方法。("获取"或"发布")。//DataType : null//“XML”，脚本"或“json”(接受服务端返回的类型)//clearForm: true //成功提交后，清除所有的表单元素的值。resetForm: true //成功提交后，重置所有的表单元素的值。//由于某种原因，提交陷入无限等待之中，超时参数就是用来限制请求的时间，//当请求大于3秒后，跳出请求//超时： 3000 }；//“AJax FORm”方式的表单$(“# my form”).ajaxForm(选项);//或者“ajaxSubmit”方式的提交//$('#myForm ').submit(function() { //$(this)).ajaxSubmit(选项);//返回false//来阻止浏览器提交。//});});//提交前函数showRequest(formData，jqForm，options) { //formdata是数组对象，在这里，我们使用$.参数()方法把他转化为字符串var queryString=$ .param(formData)；//组装数据，插件会自动提交数据alert(查询字符串)；//类似：name=1add=2返回true} //提交后函数showResponse(responseText，statusText) { alert('状态："状态文本" \n返回的内容是： \ n ' responseText)；}/脚本/头dyh 3 Demo 4 : jQuery表单插件的使用- ajaxForm()和ajaxSubmit()的可选参数项对象/h3！- demo1 -表单id='myForm '操作='ajax2.jsp '方法='post '名称：输入类型='text' name='name'/br/地址：输入类型=“文本”名称='address' /br/自我介绍：文本区域名称='注释'/文本区域br/输入类型=' submit ' id=' test ' value='提交/br/div id=' output 1 '/div/form/body/html新建一个ajax2.jsp文件：

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

填写数据：

提交表单的内容：

从服务器返回的数据：

以上内容是小编给大家分享的jQuery表单插件之ajaxForm()和ajaxSubmit()的可选参数项对象的全部叙述，希望本文分享对大家有所帮助。