<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>jQuery form插件的使用--使用 fieldValue 方法校验表单.</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({

                         target:        '#output1', // 用服务器返回的数据 更新 id为output1的内容.

                         beforeSubmit:  validate    // 提交前，验证

                });

            });

            function validate(formData, jqForm, options) {

                // fieldValue 是表单插件的一个方法，它能找出表单中的元素的值，返回一个集合。

                var usernameValue = $('input[name=name]').fieldValue();

                var addressValue = $('input[name=address]').fieldValue(); 

                if (!usernameValue[0] || !addressValue[0]) {

                    alert('用户名和地址不能为空，自我介绍可以为空！');

                    return false;

                }

                var queryString = $.param(formData); //组装数据

                //alert(queryString); //类似 ： name=1&add=2

                return true;

            }

   </script>

  </head>

  <body>

    <h3> Demo 7 : jQuery form插件的使用--使用 fieldValue 方法校验表单. </h3>

<!-- demo1 -->

<form id="myForm" action="ajax2.jsp" method="post">

              名称： <input type="text" name="name" id="name" /> <br/>

    地址： <input type="text" name="address" id="address"/><br/>

           自我介绍： <textarea name="comment" id="comment" ></textarea> <br/>

    <input type="submit" id="test" value="提交" /> <br/>

    <div id="output1" ></div>

</form>

  </body>

</html>

jQuery form插件的使用--使用 fieldValue 方法校验表单的更多相关文章

  1. jQuery form插件的使用--用 formData 参数校验表单，验证后提交（简单验证）.

    Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.引入依赖js <script src=& ...

  2. 使用jQuery.form插件，实现完美的表单异步提交

    传送门:异步编程系列目录…… 时间真快,转眼一个月快结束了,一个月没写博客了!手开始生了,怎么开始呢…… 示例下载:使用jQuery.form插件,实现完美的表单异步提交.rar 月份的尾巴,今天的主 ...

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

    一.前提说明 Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 二.简单介绍 本文演示的是:jQue ...

  4. [转载]Jquery Form插件表单参数

    表单插件API提供了几个方法,让你轻松管理表单数据和进行表单提交. ajaxForm增 加所有需要的事件监听器,为AJAX提交表单做好准备.ajaxForm不能提交表单.在document的ready ...

  5. jQuery学习笔记（jquery.form插件）

    官网: http://malsup.com/jquery/form/ jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Fo ...

  6. jQuery.Form插件介绍

    一.前言  jQuery From插件是一个优秀的Ajax表单插件,使用它可以让你非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery From有两个主要方法:ajaxForm和ajaxS ...

  7. jQuery Form插件详解

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

  8. jQuery form插件使用详解

    点击打开: jquery选择器全解 jquery中的style样式操作 jquery中的DOM操作 jquery中的事件操作全解 jquery中的动画操作全解 jquery中ajax的应用 自定义jq ...

  9. jquery.form插件中动态修改表单数据

    jquery.form jquery.form插件(http://malsup.com/jquery/form/)是大家经常会用到的一个jQuery插件,它可以很方便将表单转换为ajax的方式进行提交 ...

随机推荐

  1. P6 EPPM R16.1安装与配置指南(三)

    P6 EPPM R16.1安装与配置指南(三) 解压:V137390-01.zip 修改 D:\P6_R161\p6suite\database\dbsetup.bat   的行 SET JAR_FI ...

  2. 重构第25天 引入契约设计(Introduce Design By Contract checks)

    理解:本文中的”引入契约式设计”是指我们应该对应该对输入和输出进行验证,以确保系统不会出现我们所想象不到的异常和得不到我们想要的结果. 详解:契约式设计规定方法应该对输入和输出进行验证,这样你便可以保 ...

  3. 使用HttpRequester模拟发送及接收Json请求

    1.开发人员在火狐浏览器里经常使用的工具有Firebug,httprequester,restclient......火狐浏览器有一些强大的插件供开发人员使用!需要的可以在附加组件中扩展. 2.htt ...

  4. Python入门笔记(5):对象

    一.学习目录 1.pyhton对象 2.python类型 3.类型操作符与内建函数 4.类型工厂函数 5.不支持类型 二.思考 1.Python解释执行原理? 2.Python对象机制? 3.Pyth ...

  5. 找到MVC框架中前端URL与后端同步的解决方案

    基本思路: 先用URL标签生成完整的URL字符,前端动态参数的部分以适配符先填充,最后动态参数利用正则匹配进行替换. 这种方式,可以在各种MVC框架中适用,妙. 不废话,上码. var url = & ...

  6. 创建WCF服务自我寄宿

    WCF服务的寄宿方式 WCF寄宿方式是一种非常灵活的操作,可以寄宿在各种进程之中,常见的寄宿有: IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为 ...

  7. jdbcTemplate 泛型 查询

    1. dao层方法使用泛型 public <T> List<T> findDistinctListByCondition(String str, Class<T> ...

  8. OWIN概述

    关于OWIN OWIN defines a standard interface between .NET web servers and web applications. The goal of ...

  9. java LinkedBlockingQueue和ConcurrentLinkedQueue的区别

    实现上看,两者都继承于AbstractQueue,但是ConcurrentLinkedQueue实现了Queue,而LinkedBlockingQueue实现了BlockingQueue,Blocki ...

  10. Android sdk manager不能更新下载缓慢的解决方法

    通常情况下,下载Android SDK需要连接谷歌的服务器进行下载,由于国内水深火热的网络,速度基本为0.好在国内也有一个更新的镜像地址.本文章介绍如何在不FQ的情况下,使用国内镜像地址,更新andr ...