Jquery中的验证

最新推荐文章于 2024-11-03 20:03:09 发布
最新推荐文章于 2024-11-03 20:03:09 发布
阅读量263 收藏
点赞数
文章标签： jquery email function html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/QQ619851705/article/details/6743846
版权
 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">   
  2. <html>   
  3.  <head>   
  4.   <title> New Document </title>   
  5.   <meta name="Generator" content="EditPlus">   
  6.   <meta name="Author" content="">   
  7.   <meta name="Keywords" content="">   
  8.   <meta name="Description" content="">   
  9.    <script src="http://code.jquery.com/jquery-latest.js"></script>   
  10.   <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js" type="text/javascript"></script>   
  11.        
  12.  </head>   
  13.   
  14.  <body>   
  15.   
  16. <SCRIPT type="text/javascript">      
  17.   $(document).ready(function(){   
  18.   $("#signupForm").validate({   
  19.        rules: {   
  20.            uname: "required",   
  21.            email: {   
  22.            required: true,   
  23.            email: true  
  24.            },   
  25.            pwd: {   
  26.             required: true,   
  27.             minlength: 5  
  28.            },   
  29.            conpwd:{   
  30.             required: true,   
  31.             minlength: 5,   
  32.             equalTo: "#pwd"  
  33.            }   
  34.         },   
  35.        messages: {   
  36.            uname: "请输入姓名",   
  37.            email: {   
  38.             required: "请输入Email地址",   
  39.             email: "请输入正确的email地址"  
  40.            },   
  41.            pwd: {   
  42.             required: "请输入密码",   
  43.             minlength: jQuery.format("密码不能小于{0}个字符")   
  44.            },   
  45.            conpwd: {   
  46.             required: "请输入确认密码",   
  47.             minlength: "确认密码不能小于5个字符",   
  48.             equalTo: "两次输入密码不一致不一致"  
  49.            }   
  50.        }   
  51.     });    
  52. });   
  53.        
  54.   </SCRIPT>   
  55.   
  56.   
  57. <form id="signupForm" method="post" action="">   
  58. <p>   
  59. <label for="uname">   
  60. 用户名:   
  61. </label>   
  62. <input id="uname" type="text" name="uname"  />   
  63. </p>   
  64. <p>   
  65. <span style="width: 18px;"></span>   
  66. <label for="pwd">   
  67. 密码:   
  68. </label>   
  69. <input type="password" id="pwd" name="pwd" />   
  70. </p>   
  71. <p>   
  72. <label for="con-pwd">   
  73. 确认密码:   
  74. </label>   
  75. <input type="password" id="conpwd" name="conpwd" />   
  76. <span style="width: 20px"></span>   
  77. </p>   
  78. <p>   
  79. <span style="width: 20px"></span>   
  80. <label for="email">   
  81. 邮箱:   
  82. </label>   
  83. <input type="text" id="email" name="email" />   
  84. </p>   
  85. <p>   
  86. <input class="submit" type="submit" value="注册">   
  87. &nbsp;&nbsp;   
  88. <input type="reset" value="取消" />   
  89. </p>   
  90. </form>   
  91.  </body>   
  92. </html>  
ShiQiang
关注
html头部中各式各样的meta
weixin_30668887的博客
06-05 247
在写网页的过程中，第一步就是创建一个html文档。如下是最简单的 html5 文档。 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="wid...
html爱心特效代码
热门推荐
梦游星海的博客
10-26 44万+
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywor...
将页面内搜索结果高亮显示（使用mark.js），且页面顶部定位到第一个搜索结果
duansamve的博客
11-05 1060
<!DOCTYPE> <html> <head> <title> new document </title> <meta name="generator" content="editplus" /> <meta name="author" content="" /&gt...
HTML基础head标签的正确使用方法
we
07-14 2896
HTML文档中的head标签，描述了文档的各种属性和信息。head标签也是HTML文档中最重要的部分，一个完整的head头部文档中一定要包含标题title，meta，link等。 文档的头部描述了文档的各种属性和信息，下面这些标签可用在 head 部分：, , , , , 以及 。一、 定义文档的标题，它是 head 部分中唯一必需的元素。作用就是定义网页的标题，这个标题指的是浏览器上栏的标题，而不是网...
HTML中的Label 在表单中的应用
chenfengstrong的专栏
07-14 719
在表单布局中会遇到label标签的使用，label没有任何样式效果，有触发对应表单控件功能。 比如我们点击单选按钮或多选框前文字对应选项就能被选中，这个就是对文字加了标签实现。     new document             男 女   label 的for 的值分别是单选的value，点击label的
JQuery 表单验证框架
yueyehuguang的博客
05-23 1575
JQuery Validate 插件为表单提供了强大的验证功能，让客户端表单验证变得更简单，同时提供了大量的定制选项，满足应用程序各种需求。该插件捆绑了一套有用的验证方法，包括 URL 和电子邮件验证，同时提供了一个用来编写用户自定义方法的 API。所有的捆绑方法默认使用英语作为错误信息，且已翻译成其他 37 种语言。
jQuery中验证输入信息是否符合标准
每天进步一点点
08-08 1513
表单验证 $(document).ready(function(e) {     $(".required").blur(function(){ if(this.value==""||this.value.length alert("请输入正确长度的用户名");} }); }); 用户名：   邮箱：
Java Web Jquery表单验证
07-26
编写基于Jquery的表单验证插件 Java Web Jquery表单验证 jQuery是一个流行的JavaScript库，可用于在网页上进行各种操作，包括表单验证。 1、将基于Jquery的表单验证的调查问卷分为四个部分：FrontPage.html、write....
jQuery密码验证规则
06-01
实现jQuery验证逻辑** 在`pwd.js`文件中，我们编写jQuery代码来处理用户输入并验证密码： ```javascript $(document).ready(function() { var pwdRules = { length: 8, complexity: /(?=.*\d)(?=.*[a-z])(?=.*...
jQuery正则验证注册页面经典实例
10-19
在两次密码输入的验证中，我们通常需要比对两次输入的密码是否一致。如果一致，说明用户输入的密码是正确的，否则将提示用户两次输入不一致。 电子邮箱的验证则通过正则表达式`/^\w+@\w+(\.[a-zA-Z]{2,3}){1,2}$/`...
Yii框架中jquery表单验证插件用法示例
12-18
本文实例讲述了Yii框架中jquery表单验证插件用法。分享给大家供大家参考，具体如下： 运行效果图如下： 视图层： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
jQuery表单验证
10-29
在表单验证中，我们经常利用这些选择器选取需要验证的表单元素。 三、表单验证的基本步骤 1. **选取表单元素**：使用jQuery选择器选取需要验证的表单元素，如`$("#username")`选取用户名输入框。 2. **绑定事件**...
HTML CSS练习-五环效果
sushi18257的博客
10-07 439
1,完整代码： &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html&gt;  &lt;head&gt;   &lt;title&gt; New Document &lt;/title&gt;   &
HTML 基础标签——元数据标签 ＜meta＞
Allen-
11-01 487
标签通常位于文档的部分。它用于定义文档的元数据，包括字符编码、文档描述、关键字、作者信息等。这些信息可以帮助浏览器正确解析和显示文档，同时还可以提供搜索引擎索引所需的信息。
HTML前端页面设计静态网站-仿百度
2402_86955314的博客
11-02 493
浅浅分享一下前端作业，大佬轻喷~
HTML 块级元素和内联（行内）元素详解
Allen-
11-03 160
块级元素是页面中的结构元素，它们独占一行，通常用于搭建页面的主要框架，如段落、容器、标题等。它们无论其内容多少，都会占据父元素的整个宽度。这种特性使得块级元素特别适合用于页面的整体布局和内容的分区组织。内联元素是页面中用于**修饰或嵌入小块内容的元素，它们不会独占一行，可以与其他内联元素或文本同行显示，因此也叫行内元素
HTML 标签属性——id、class、style 等全局属性详解
Allen-
11-02 337
HTML全局属性是一组可以应用于几乎所有HTML元素的特殊属性。这些属性提供了额外的功能和信息，使得网页开发者能够更好地控制元素的行为、样式和可访问性。
HTML字符实体详解
最新发布
Allen-
11-03 171
HTML 字符实体是在 HTML 文档中用来表示特定字符的特殊编码。这些字符可能因为直接输入而引发解析错误，或某些字符在 HTML 中具有特殊含义（例如，< 和 > 用于标签）。因此，使用字符实体可以确保文本的准确呈现。
HTML 基础标签——文本内容标签 ＜ul＞、＜ol＞、＜blockquote＞ 、＜code＞ 等标签的用法详解
Allen-
11-01 717
在 HTML 文档中，文本内容标签用于定义和格式化文本信息。这些标签不仅使文本内容易于阅读和理解，还可以通过不同的格式和结构增强网页的可读性。本文将详细介绍常用的文本内容标签，包括标题标签、段落标签、文本格式化标签、列表标签、引用标签，以及代码和预格式文本标签。
jQuery表单验证实战教程
"jQuery表单验证实例教程" 在网页开发中，表单验证是一个至关重要的环节，它确保用户输入的数据符合预期格式，从而避免...通过学习和实践此类实例，你可以更好地掌握jQuery在表单验证中的应用，提升你的前端开发技能。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值