jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址

时间:2022-09-18 10:26:01

 一、jQuery Form简介

jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地、无侵入地升级HTML表单以支持Ajax。jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmit(), 它们集合了从控制表单元素到决定如何管理提交进程的功能。另外,插件还包括其他的一些方法: formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()、clearFields() 和 resetForm()等。

jQuery Form Plugin 能够让你简洁的将以HTML形式提交的表单升级成采用AJAX技术提交的表单。

插件里面主要的方法, ajaxForm 和 ajaxSubmit, 能够从form组件里采集信息确定如何处理表单的提交过程。两个方法都支持众多的可选参数,能够让你对表单里数据的提交做到完全的控制。这让采用AJAX方式提交一个表单的过程简单的不能再简单了!

二、下载地址

下载地址: http://malsup.com/jquery/form/#download

Github主页: https://github.com/malsup/form

网盘下载:https://yunpan.cn/crjzfmXqaTu9e  访问密码 e3bc

三、资料

中文在线文档:http://www.vaikan.com/docs/jquery.form.plugin/jquery.form.plugin.html

英文在线文档:http://jquery.malsup.com/form/

四、简单的体验例子

1. 在你的页面里写一个表单。一个普通的表单,不需要任何特殊的标记:

<form id="myForm" action="comment.jsp" method="post">
Name: <input type="text" name="name" />
Comment: <textarea name="comment"></textarea>
<input type="submit" value="Submit Comment" />
</form>

2. 引入jQuery和Form Plugin Javascript脚本文件并且添加几句简单的代码让页面在DOM加载完成后初始化表单:

<script src="jquery-1.3.1.js" type="text/javascript"></script>
<script src="jquery.form.js" type="text/javascript"></script>

或是通过CDN:

<script src="http://malsup.github.io/jquery.form.js" type="text/javascript"></script>
<script src="//oss.maxcdn.com/jquery.form/3.50/jquery.form.min.js"></script>
<script src="http://malsup.github.io/min/jquery.form.min.js"></script>

然后编写页面:

<form id="myForm" action="demo.jsp" method="post">
名称: <input type="text" name="name" /> <br/>
地址: <input type="text" name="address" /><br/>
自我介绍: <textarea name="comment"></textarea> <br/>
<input type="submit" id="test" value="提交" /> <br/>
<div id="output1" style="display:none;"></div>
</form>

3. 当表单提交后name ,address 和 comment的值就会被提交给demo.jsp. 如果服务器端返回成功的状态,用户将会看到一句提示信息 "Thank you" 。

详细代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>demo1.html</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="jquery-1.3.1.js" type="text/javascript"></script>
<script src="jquery.form.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#myForm').ajaxForm(function() {
$('#output1').html("提交成功!欢迎下次再来!").show();
});
});
</script>
</head> <body>
<h3> Demo : form插件的使用--ajaxForm(). </h3>
<form id="myForm" action="demo.jsp" method="post">
名称: <input type="text" name="name" /> <br/>
地址: <input type="text" name="address" /><br/>
自我介绍: <textarea name="comment"></textarea> <br/>
<input type="submit" id="test" value="提交" /> <br/>
<div id="output1" style="display:none;"></div>
</form>
</body>
</html>

其他关联教程:

jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址

jQuery Form 表单提交插件-----ajaxForm() 的应用

jQuery Form 表单提交插件-----ajaxSubmit() 的应用

jQuery Form 表单提交插件-----ajaxForm() 的应用

jQuery Form 表单提交插件-----ajaxSubmit() 的应用

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

jQuery form插件的使用--ajaxForm()和ajaxSubmit()的可选参数项对象

jQuery form插件的使用--用 formData 参数校验表单,验证后提交(简单验证).

jQuery form插件的使用--使用 fieldValue 方法校验表单

jQuery form插件的使用--处理server返回的JSON, XML,HTML数据

jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址的更多相关文章

  1. jQuery Form 表单提交插件-----formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的 应用

    一.jQuery Form的其他api  1.  formSerialize 将表单序列化成查询串.这个方法将返回一个形如: name1=value1&name2=value2的字符串.是否可 ...

  2. jQuery Validate 表单验证插件----Validate简介,官方文档,官方下载地址

     一. jQuery Validate 插件的介绍 jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆 ...

  3. jQuery Form 表单提交插件-----ajaxSubmit&lpar;&rpar; 的应用

    Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.ajaxSubmit() 介绍  立即通过AJ ...

  4. jQuery Form 表单提交插件-----ajaxForm&lpar;&rpar; 的应用

    Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.ajaxForm() 介绍  ajaxForm ...

  5. Jquery组织Form表单提交之Form submission canceled because the form is not connected

    有时候导出Excel时需要根据某些条件筛选数据,然后将数据通过NPOI生成Excel并导出.组织数据时可以通过放到一个表单中,某些场景是使用脚本(如:jquery)组织一个form(通过字符串拼接), ...

  6. Linux curl 模拟form表单提交信息和文件

    Linux curl 模拟form表单提交信息和文件   curl是一个命令行方式下传输数据的开源传输工具,支持多种协议:FTP.HTTP.HTTPS.IMAP.POP3.TELNET等,功能超级强大 ...

  7. jqPaginator分页(ajax用法和form表单提交用法)

    一般使用方法 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UT ...

  8. jquery插件-表单提交插件-jQuery&period;Form

    1.介绍 JQuery Form插件是一款强大的Ajax表单提交插件,可以简单方便的实现让我们的表单 由传统的提交方式转换成Ajax无刷新提交! 他提供了两个核心的方法ajaxForm以及ajaxSu ...

  9. jQuery补充之jQuery扩展&sol;form表单提交&sol;滚动菜单

    jQuery扩展 为了避免重复造*,能高效使用别人的代码,所以有了扩展. jQuery扩展有两种方式: 自执行函数方式 定义函数,并执行函数. 自执行函数: (function(jq){ jq.ex ...

随机推荐

  1. 在ubuntu上搭建开发环境3---解决Y470一键系统重装之后恢复ubuntu引导启动的方法

    2015/08/18 将知识.常用的操作整理出来一定要完整,注意细节. 就像下面是再2015.04.27时候整理的,当时确实实验成功了,但是可能忘记记下具体的细节,尤其是3.4.5.6步骤中的关于盘符 ...

  2. php中的不常用数组函数(一)(数组中元素的键和值对调 array&lowbar;flip&lpar;&rpar;)

    array_flip($arr); //交换数组中的键和值. //如下所示,如果$arr中有相同的值.交换之后 会被旧的覆盖,最后一个有效. /***********array_flip(交换数组中的 ...

  3. Linux中挂载移动硬盘的方法

    - fdisk -l 找出移动硬盘对应的设备 - mkdir 创建挂载点 mkdir /mnt/usb - mount mount -t ntfs-3g /dev/sdb1  /mnt/usb - u ...

  4. 第一章 01 namespace 命名空间

    一.什么是namespace? namesapce是为了防止名字冲突提供的一种控制方式. 当一个程序需要用到很多的库文件的时候,名字冲突有时无法避免.之前的解决思路是使用更长的变量名字,使用不方便. ...

  5. Android - 关于设备版本号

    设备信息可以在Settings - About 里看到 最近想改机器的build number,找到了 build/core/Makefile 里的定义 # Display parameters sh ...

  6. Java8 按照类属性去重

    测试po package com.shiwulian.test.po; public class Person {private String id;private String name;priva ...

  7. HVP plan

    HVP,hier verification plan,建立整个验证的plan,在验证后期,通过vcs的coverage db可以直接进行反标, 包括反标code coverage,function c ...

  8. 在局域网内实现https安全访问

    在局域网内实现https安全访问 准备原料 服务器 resin (当然也可以是tomcat,这里以resin为例) 安装jdk 域名 (随便写一个就行,因为是内网使用,不会被校验) 生成证书 第一步: ...

  9. 【Spring】SpringMVC非注解配置的两种方式

    目录结构: contents structure [+] SpringMVC是什么 Spring MVC的设计原理 SpringMVC配置的第一种方式 1,复制Jar包 2,Web.xml文件 3,M ...

  10. VS调试dll

    (ps:编译dll的工程最好配置一下预编译宏:“配置属性”/“C或C++”/“预处理器”/“预处理器定义”,选择编辑,在最下面加一行“_CRT_SECURE_NO_WARNINGS”) 1. 右键dl ...