汇盛国际娱乐:Jquery提交表单 Form.js官方插件介绍

标签:帮助中心    日期:2017-11-05 10:57    录入:汇盛国际平台    浏览:

  

[提交表单]Jquery提交表单 Form.js官方插件介绍

  先说说常用的Form插件,支持Ajax,支持Ajax文件上传,功能强大,基本满足日常应用。

  
1、最新JQuery框架软件包下载  
jquery.js压缩包  
jquery.js非压缩包  
2、Form插件下载  
form.js  
  
3、Form插件的简单入门  
第一步:先增加一个表单  
代码:  
代码如下:

  
  
Name:   
Comment:   
  
  
  
第二步:jquery.js和form.js文件的包含  
代码:  
代码如下:
  
  
  
  
  
// wait for the DOM to be loaded  
$(document).ready(function() {  
// bind 'myForm' and provide a simple callback function  
$('#myForm').ajaxForm(function() {  
alert("Thank you for your comment!");  
});  
});  
  
  
  
3、Form插件的详细使用方法及应用实例  
  
============================  
该插件的作者在介绍form.js时,说了这样的一句话:  
引用:  
Submitting a form with AJAX doesn't get any easier than this!

  
意思是说,用Ajax来提交表单,你不可能找到比这个更容易的了。呵呵——,是否吹水,大家用过了就知道了。

  
  
表单插件API  
  
英文原文:  
表单插件API提供了几个方法,让你轻松管理表单数据和进行表单提交。

  
ajaxForm  
增加所有需要的事件监听器,为AJAX提交表单做好准备。ajaxForm不能提交表单。在document的ready函数中,使用ajaxForm来 为AJAX提交表单进行准备。ajaxForm接受0个或1个参数。这个单个的参数既可以是一个回调函数,也可以是一个Options对象。

  
可链接(Chainable):可以。

  
实例:  
代码:  
代码如下:

  
$('#myFormId').ajaxForm();  
ajaxSubmit  
  
马上由AJAX来提交表单。大多数情况下,都是调用ajaxSubmit来对用户提交表单进行响应。ajaxSubmit接受0个或1个参数。这个单个的参数既可以是一个回调函数,也可以是一个Options对象。

  
可链接(Chainable):可以。

  
实例:  
代码:  
代码如下:

  
// 绑定表单提交事件处理器  
$('#myFormId').submit(function() {  
// 提交表单  
$(this).ajaxSubmit();  
// 为了防止普通浏览器进行表单提交和产生页面导航(防止页面刷新?)返回false  
return false;  
});  
formSerialize  
  
将表单串行化(或序列化)成一个查询字符串。这个方法将返回以下格式的字符串:name1=value1&name2=value2。

  
可链接(Chainable):不能, 这个方法返回一个字符串。

  
实例:  
代码:  
代码如下:

  
var queryString = $('#myFormId').formSerialize();  
// 现在可以使用$.get、$.post、$.ajax等来提交数据  
$.post('myscript.php', queryString);  
fieldSerialize  
  
将表单的字段元素串行化(或序列化)成一个查询字符串。当只有部分表单字段需要进行串行化(或序列化)时,这个就方便了。这个方法将返回以下格式的字符串:name1=value1&name2=value2。

  
可链接(Chainable):不能,这个方法返回一个字符串。

  
实例:  
代码:  
var queryString = $('#myFormId .specialFields').fieldSerialize();  
fieldValue  
返回匹配插入数组中的表单元素值。从0.91版起,该方法将总是以数组的形式返回数据。如果元素值被判定可能无效,则数组为空,否则它将包含一个或多于一个的元素值。

  
可链接(Chainable):不能,该方法返回数组。

  
实例:  
代码:  
代码如下:

  
// 取得密码输入值  
var value = $('#myFormId :password').fieldValue();  
alert('The password is: ' + value[0]);  
resetForm  
  
通过调用表单元素原有的DOM方法,将表单恢复到初始状态。

  
可链接(Chainable):可以。

  
实例:  
代码:  
$('#myFormId').resetForm();  
clearForm  
清除表单元素。该方法将所有的文本(text)输入字段、密码(password)输入字段和文本区域(textarea)字段置空,清除任何select元素中的选定,以及将所有的单选(radio)按钮和多选(checkbox)按钮重置为非选定状态。

★★★小编:汇盛国际注册 整理文章,欢迎大家转载 ★★★
上一篇:浅谈JavaScript中promise的使用
下一篇:没有了
相关文章阅读
点击右上角的分享按钮即可收藏汇盛国际平台注册 随时随地与好友一起分享精彩内容噢
最近更新
热门排行