一、官网下载jquery,和jquery validation plugin http://jqueryvalidation.org/

二、引入文件

<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>

三、接下来,声明下面的HTML片段

<form action="" id="jvForm">
姓名:<input type="text" name="username" id="username" class="required" /></br>
密码:<input type="password" name="password" id="password" class="required"/></br>
<input type="submit" value="提交" />
</form>

通过以上代码,大家会发现我们对于每一个input都加上了class="required"

他的作用就是在这个inpute标签为空时会提示用户出错。

四、最后我们要为我们的框架找到一个切入点

<script type="text/javascript">
$(function() {
$("#jvForm").validate();
})
</script>

运行效果如下

当然提示信息默认是英文的,可根据需要在jquery.validate.js里修改

jQuery Validation让验证变得如此容易(一)的更多相关文章

  1. jQuery Validation让验证变得如此容易(三)

    以下代码进行对jQuery Validation的简单演示包括必填项.字符长度,格式验证 一.引入文件 <script src="js/jquery-1.8.0.min.js" ...

  2. jQuery Validation让验证变得如此easy(三)

    下面代码进行对jQuery Validation的简单演示包含必填项.字符长度,格式验证 一.引入文件 <script src="js/jquery-1.8.0.min.js" ...

  3. jQuery Validation让验证变得如此easy(一)

    一.官网下载jquery,和jquery validation plugin http://jqueryvalidation.org/ 二.引入文件 <script src="js/j ...

  4. jQuery Validation让验证变得如此容易(二)

    上一个例子我们是统一引用jquery.validate.js这样所有必填字段的提示信息都将是This field is required. 现在要改成动态提示,比如姓名如果为空则提示姓名不能为空,密码 ...

  5. jQuery Validation让验证变得如此easy(二)

    上一个样例我们是统一引用jquery.validate.js这样全部必填字段的提示信息都将是This field is required. 如今要改成动态提示,比方姓名假设为空则提示姓名不能为空,密码 ...

  6. Jquery Validation 插件验证手机号

    自定义手机号验证代码  http://www.2cto.com/kf/201505/402781.html // 手机号码验证 jQuery.validator.addMethod("isM ...

  7. jquery validation ajax 验证

    <link href="${base}/res/basic/css/jquery/validationEngine/validationEngine.jquery.css" ...

  8. jquery validation 简单验证手机号码

    js代码 // 手机号码验证 jQuery.validator.addMethod("isMobile", function(value, element) { var lengt ...

  9. Jquery validation自定义验证

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. Cgroup maintainer丽泽范:解剖Linux核心容器技术

    摘要:Cgroup和namespace等内核特性如何出现,在社区处于如何的开发状况?Docker如火如荼.内核社区是否会因此加紧完好容器技术的隔离性安全性?华为Linux内核高级project师李泽帆 ...

  2. Redis源代码分析(二十七)--- rio制I/O包裹

    I/O每个操作系统,它的一个组成部分.和I/O业务质量,在一定程度上也影响了系统的效率. 今天,我在了解了Redis中间I/O的,相同的,Redis在他自己的系统中.也封装了一个I/O层.简称RIO. ...

  3. BEGINNING SHAREPOINT&#174; 2013 DEVELOPMENT 文件夹

    BEGINNING SHAREPOINT® 2013 DEVELOPMENT 文件夹 第一部分--開始使用SharePoint 2013 第1章节--SharePoint 2013 介绍 逐渐了解Sh ...

  4. Java设计模式论述

    为何须要设计模式: 模式是做事的方法,是实现目标,研磨技术的方法.这样的对高效技术不懈追求的思想,广泛见于诸多领域,比如制作精美佳肴的过程.对于不论什么一种迈向成熟的全新技艺,身处这个行业的人都须要寻 ...

  5. Java发送get及post请求工具方法

    import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import ...

  6. 使用C/C++发展Web系统开源

    下载 见 C++开发的论坛系统 - BBS 下载地址:Fetch_source_code_release_vse2008_v1.2.1.7z 眼下先暂存在百度云上,最近会放入github 当前版本号的 ...

  7. Magicodes.NET框架

    Magicodes.NET框架之路——让代码再飞一会(ASP.NET Scaffolding)   首先感谢大家对Magicodes.NET框架的支持.就如我上篇所说,框架成熟可能至少还需要一年,毕竟 ...

  8. Appium0.18.x迁移到Appium1.x须知事项

    英文原版:https://github.com/appium/appium/blob/master/docs/en/advanced-concepts/migrating-to-1-0.md Migr ...

  9. ExtJS4 便捷三层开发模式

    ExtJS4 便捷三层开发模式 定义类已经不是ext4.x一个新特性,但与ext3.x的自定义类有语法上的区别.将相关模块封装成类可以有效的减少浏览器的压力,提高渲染速度,同时抽象每一个可重用方法,减 ...

  10. uva 1560 - Extended Lights Out(枚举 | 高斯消元)

    题目链接:uva 1560 - Extended Lights Out 题目大意:给定一个5∗6的矩阵,每一个位置上有一个灯和开关,初始矩阵表示灯的亮暗情况,假设按了这个位置的开关,将会导致周围包含自 ...