作用:jQuery Form插件的作用是为了让我们可以很方便地用ajax的方式提交表单,从而使我们提交表单的时候页面不用进行刷新。

它的核心方法是ajaxForm()和ajaxSubmit()

升级表单提交方式的时候很简单,不用去改变HTML结构,如下即可:

  //就是下面这么简单
$("#myForm").ajaxForm(function(){
//提交成功后的操作
});
//你也可以这样
$("#myform").submit(function(){
$(this).ajaxSubmit(function(){
//提交成功后的操作
});
return false;//阻止表单默认提交
});

提交表单的时候不仅可以像上面的例子那样,给ajaxForm和ajaxSubmit传递一个回调函数,还可以传递一个options对象。

定义了一个options如下:

var options={
target:"#output1",//把服务器返回的内容放入id为output1的元素中
beforeSubmit:function(formData,jqForm,options){//提交前的回调函数
//formData为数组对象,即提交的数据
//jqForm是一个jQuery对象,封装了表单元素
//options就是options对象
//在这个回调函数里,返回false会阻止表单提交
}
success:function(responseText,statusText,xhr,$form){//提交后的回调函数
//statusText是返回状态,值为success和error等
//responseText携带服务器返回的的数据内容。
//会根据datatype的类型来返回相应格式的内容
//对于缺省值:返回的是XMLHttpRequest对象的responseXML属性
},
url:url, //默认为form的action,如果申明,就用url
type:type, //默认为form的method(post或get),如果申明,就覆盖
dataType:null, //服务端返回的类型
clearForm:true, //成功提交后,清除所有表单元素的值
resetForm:true, //成功提交后,重置所有表单元素的值
timeout: //限制请求的超时时间,大于3秒,跳出请求
}
$("myForm").ajaxForm(options);

【jQuery基础学习】07 jQuery表单插件-Form的更多相关文章

  1. 表单插件——form

    表单插件——form 通过表单form插件,调用ajaxForm()方法,实现ajax方式向服务器提交表单数据,并通过方法中的options对象获取服务器返回数据,调用格式如下: $(form). a ...

  2. jQuery基础学习(二)—jQuery选择器

    一.jQuery基本选择器 1.CSS选择器     在学习jQuery选择器之前,先介绍一下之前学过的CSS选择器. 选择器 语法 描述 示例   标签选择器 E {                 ...

  3. jQuery基础学习3——jQuery库冲突

    默认情况下,jQuery用$作为自身的快捷方式. jQuery库在其他库之后导入 在其他库和jQuery库都被加载完毕后,可以在任何时候调用jQuery.noConflict()函数来将变量$的控制权 ...

  4. [原创]java WEB学习笔记62:Struts2学习之路--表单标签:form,表单标签的属性,textfield, password, hidden,submit ,textarea ,checkbox ,list, listKey 和 listValue 属性,select ,optiongroup ,checkboxlist

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  5. jQuery基础学习(一)—jQuery初识

    一.jQuery概述 1.jQuery的优点      jQuery是一个优秀的JavaScript库,极大地简化了遍历HTML文档.操作DOM.处理事件.执行动画和开发Ajax的操作.它有以下几点优 ...

  6. jQuery基础学习4——jQuery容错性

    使用jQuery选择器不仅比使用传统的getElementById()和getElementsByTagName()函数简洁得多,而且还能避免某些错误. <script type="t ...

  7. jQuery基础学习(三)—jQuery中的DOM操作

    一.查找节点      查找属性节点: 通过jQuery的选择器来完成.      操作属性节点: 调用jQuery对象的attr()来获取它的属性值.      操作文本节点: 通过text()方法 ...

  8. jQuery 基础学习笔记总结(一)

    Jquery 学习笔记 总结 感想: 此前在做站点时用到过jquery相关,特别是Ajax相关技术.但是并没有系统的进行学习和了解Jquery的强大的功能,趁这几天跟着资料基本的了解下Jquery的特 ...

  9. jQuery Label Better – 友好的表单输入框提示插件

    jQuery Label Better 帮助你标记您的表单输入域,带有美丽的动画效果而且不占用空间.这个插件的独特之处在于所有你需要做的就是添加一个占位符文本,只有当用户需要它的时候才显示标签. 您可 ...

随机推荐

  1. Xiph基金会成员:Timothy B. Terriberry

    Speex,CELT,Opus的发明人之一 还特意写了高中:Thomas Jefferson High School for Science and Technology Shit 一查,全美第一名的 ...

  2. Erwin 生成 mysql 带注释(comment )的脚本

    Erwin设计数据库非常方便,有逻辑视图和物理视图,可以很方便的生成数据库文档和SQL 脚本.在使用过程中唯一不爽的地方是脚本不能生成comment.   在百度无数次无法解决下,又FQ谷歌,在一个日 ...

  3. MAC 磁盘清理工具 ncdu

    下载命令:brew install ncdu 使用命令:ncdu . 它会将当前目录下的所有文件.文件夹大小安倒叙排列,方便清除

  4. awstats 日志分析工具linux下的安装和使用

    合并日志文件可以使用 bash 的sort命令: -o log_all access*.log 也可以使用  awstats 提供的 logresolvemerge.pl -showsteps acc ...

  5. saiku、mondrian前奏之——立方体、维度、Schema的基本概念

    以前介绍了几个基本工具:saiku 和 Schema Workbench,算是入门级别的了解多维报表,如果要继续深入,需要深入了解如下几个概念: 1.OLAP 联机分析处理,和他对应的是OLTP(联机 ...

  6. Microsoft 2013 新技术学习笔记 二

    在探讨系统重构的代码结构组织之前,先初步考虑框架与数据库的交互,在.net平台上数据访问方案有人总结为三类:DataSet.ADO.net 2.0.ORM组件.我只熟悉ADO.NET方式,众多的企业特 ...

  7. Mysql :removeAbandonedTimeout:180

    #数据库链接超过3分钟开始关闭空闲连接 秒为单位 removeAbandonedTimeout:180 这个参数会是一个坑吗? http://www.oschina.net/question/1867 ...

  8. QCopChannel的用法

    QT提供了很多的进程间通讯的方法,例如共享内存,QProcess等等.但有一种方法是嵌入式端所独有的,那就是Qt Communications Protocol(QCOP)QT通讯协议,这种方法只能用 ...

  9. Objective-C Polymorphism

    #import <Foundation/Foundation.h> @interface Shape : NSObject { CGFloat area; } -(void)printAr ...

  10. cocos2d-x开发: 整合apache http,用于自己检索多项目svn文件

    本来我的项目都是放在自己的虚拟机svn仓库中,随着仓库越来越多,有的时候需要去查看项目文件.check out到本地之后,挨个查看也是可以的,可是check out也是需要时间的,就想起了apache ...