jQuery实现验证表单密码一致性及正则表达式验证邮箱、手机号的方法

本文实例讲述了jQuery实现验证表单密码一致性及正则表达式验证邮箱、手机号的方法。

jQuery 脚本

<script type="text/javascript">
function check_password() {
  if ($("#password").val() != $("#checkPWD").val()){
    alert("请保证两次输入密码的一致性!");
    $("#checkPWD").focus();
  }
}
function check_email() {
  var reg = /\w+[@]{1}\w+[.]\w+/;
  if (!reg.test($("#email").val())){
    alert("请输入正确的email!");
    $("#email").focus();
  }
}
function check_phone() {
  var reg = /^1[34578]\d{9}$/;
  if (!reg.test($("#phone").val())){
    alert("请输入正确的手机号!");
    $("#phone").focus();
  }
}
</script>

html 文件

<!DOCTYPE html>
<html>
<head>
  <script src="jquery1.3.2.js"></script>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>注册界面</title>
</head>
<body>
  <center>
    <h1>用户注册</h1>
    <form action="" method="post">
      <table width="400px" cellspacing="0px" cellpadding="0px" border="1px">
        <tr>
          <td>用户名</td>
          <td><input type="text" name="username" placeholder="用户名为3-12位字母数字或下划线组合" ></td>
        </tr>
        <tr>
          <td>密 码</td>
          <td><input type="password" name="password" placeholder="密码长度为6-12位的纯数字" id="password"></td>
        </tr>
        <tr>
          <td>确认密码</td>
          <td><input type="password" name="checkPWD" placeholder="密码长度为6-12位的纯数字" id="checkPWD" onchange="check_password()"></td>
        </tr>
        <tr>
          <td>手机号码</td>
          <td><input type="text" name="phone" placeholder="请输入正确的手机号码格式" id="phone" onchange="check_phone()"></td>
        </tr>
        <tr>
          <td>邮箱</td>
          <td><input type="email" name="email" placeholder="请输入正确邮箱格式" id="email" onchange="check_email()" required="required"></td>
        </tr>
        <tr>
          <td colspan="2" style="text-align:center">
            <input type="submit" value="注册">
            <input type="reset" value="重置">
          </td>
        </tr>
      </table>
    </form>
  </center>
</body>
</html>

运行结果:

PS:这里再为大家提供2款非常方便的正则表达式工具供大家参考使用:

JavaScript正则表达式在线测试工具:
http://tools.jb51.net/regex/javascript

正则表达式在线生成工具:
http://tools.jb51.net/regex/create_reg

更多关于jQuery相关内容可查看本站专题:《jQuery正则表达式用法总结》、《jQuery字符串操作技巧总结》、《jQuery操作xml技巧总结》、《jQuery扩展技巧总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

时间: 2017-12-03

jQuery如何用正则表达式验证手机号、身份证号、中文名称

数字判断方法:isNaN()函数 test()方法 判断字符串中是否匹配到正则表达式内容,返回的是boolean值 ( true / false ) // 验证中文名称 function isChinaName(name) { var pattern = /^[\u4E00-\u9FA5]{1,6}$/; return pattern.test(name); } // 验证手机号 function isPhoneNo(phone) { var pattern = /^1[34578]\d{9}$

js与jquery正则验证电子邮箱、手机号、邮政编码的方法

本文实例讲述了js与jquery正则验证电子邮箱.手机号.邮政编码的方法. jQuery代码: //验证邮政编码 $("#postcode").blur(function(){ //获取邮政编码 var postcode=$("#postcode").val(); if(is_postcode(postcode)){ $("#postcode_info").html(""); }else{ $("#postcode_

jQuery验证手机号邮箱身份证的正则表达式(含港澳台)

自己对正则验证也没系统用过,这次自己做个demo,一下子把这些全都用上了,下次有需要直接来拿了. 以下代码是在页面使用JQuery进行验证的,也有在后台进行验证的,可以试试,都一样的原理. 直接上代码:注意:(有些验证规则当然不仅仅是本文的,也许还有其他更好的,可以留言交流) 手机号:(移动-电信-联通) var tel = $("#PhoneNumber").val();//获取输入的手机号 var yidongreg = /^(134[012345678]\d{7}|1[34578

jquery实现手机号码选号的方法

本文实例讲述了jquery实现手机号码选号的方法.分享给大家供大家参考.具体如下: 前段时间看到联通的自由组合套餐非常诱人于是决定换号,但选号是个非常累人的活在免费的号码列表中选了好久都没选到心仪的号码,于是写了个脚本去分析这些手机号码,虽然不是非常准确,但至少把那堆垃圾号码过滤掉了.欢迎拍砖. 代码依赖jQuery,有兴趣的自己重构去除依赖. 建议使用Chrome浏览器的调试工具执行. jquery手机号码分析评分: /*class*/RegexpMatchScorer = function

jquery正则表达式验证(手机号、身份证号、中文名称)

本文实例需要验证的内容:中文姓名.手机号.身份证和地址,验证方法分享给大家供大家参考,具体内容如下 HTML(表单): <form action=""> <div class="form-group"> <label>姓名:</label> <input id="name" type="text"> </div> <div class="f

jQuery实现手机号码输入提示功能实例

本文实例讲述了jQuery实现手机号码输入提示功能的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"&g

jquery验证手机号码、邮箱格式是否正确示例代码

复制代码 代码如下: //jquery验证邮箱 function checkSubmitEmail() { if ($("#email").val() == "") { //$("#confirmMsg").html("<font color='red'>邮箱地址不能为空!</font>"); alert("邮箱不能为空!") $("#email").focus(

jquery验证手机号是否正确实例讲解

如果要做手机号的验证,那么我们需要知道手机号码的号段. //移动号码归属地支持号段:134 135 136 137 138 139 147 150 151 152 157 158 159 178  182 183 184 187 188 //联通号码归属地支持号段:130 131 132  145 155 156 176  186 //电信号码归属地支持号段:133 153 177 180 181 189  //移动运营商:170 移动: 2G号段(GSM):134-139.150.151.15

jQuery实现手机号正则验证输入及自动填充空格功能

本文实例讲述了jQuery实现手机号正则验证输入及自动填充空格功能.分享给大家供大家参考,具体如下: 先来看看运行效果(在删除时连删即可): 具体代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <inpu

asp 验证输入网址是否有效并可以访问 与正则验证输入网址

核心代码: 验证输入网址是否有效并可以访问 <% '****************************** '函数:UrlOK(strURL) '参数:strURL,待验证的网址 '日期:2007/7/13 '描述:验证输入网址是否有效并可以访问 '示例:<%=UrlOK("http://www.jb51.net")%> '****************************** Function UrlOK(strURL) On Error Resume

JS不用正则验证输入的字符串是否为空(包含空格)的实现代码

在项目中需要验证输入的字符串是否为空,包括空格,不太喜欢使用正则,所以就想到了js的indexOf函数,indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置,如果要检索的字符串值没有出现,则该方法返回 -1. 语法:stringObject.indexOf(searchvalue,fromindex),searchvalue必需,fromindex:可选参数,在字符串中开始检索的位置.它的合法取值是 0 到 stringObject.length - 1.如省略该参数,则将从

jquery实现邮箱自动填充提示功能

邮箱的广泛使用得益于它的免费,因此很多网站在注册的时候都会直接使用邮箱作为账号名 为了提高用户的体验,很多网站都会实现邮箱输入的自动提示功能,所有自己也实现了一个,先看下效果吧,觉得效果还行的就拿去 核心代码(需要jquery的支持): (function($){ $.fn.mailAutoComplete = function(options){ var defaults = { boxClass: "mailListBox", //外部box样式 listClass: "

Laravel框架使用Seeder实现自动填充数据功能

本文实例讲述了Laravel框架使用Seeder实现自动填充数据功能.分享给大家供大家参考,具体如下: 要查看代码,可以点击链接:https://github.com/laravel/framework Laravel自动填充数据使用的是Seeder类 <?php use Illuminate\Database\Seeder; use Illuminate\Database\Eloquent\Model; class DatabaseSeeder extends Seeder { /** * R

jQuery 实现自动填充邮箱功能(带下拉提示)

在做这个功能时候,我参考的是网易注册(http://reg.163.com/reg/reg.jsp?product=urs)中的邮箱栏目所实现的功能与效果.这个功能的目的是使用户在填写邮箱栏目的过程中,在带有邮箱后缀名的菜单的提示下,可以不需要完整输入自己的注册邮箱,达到方便.快捷.友好的效果.在做这个功能的时候,需要充分站在使用者的角度,看怎样设计能够最符合通常情况下人们的使用习惯,又怎样设计反而会让用户感到不便.先来看看功能实现的演示效果图: 在线演示:http://jsfiddle.net

jquery.autocomplete修改实现键盘上下键自动填充示例

根据需求要实现通过键盘上下移动,获得联想菜单中的值,如同google baidu的查询功能. 在网上找了很久没有找到可以实现该功能的插件,无奈只能自己动手改代码. 找到js中的KEY.DOWN 和 KEY.UP执行代码 如下: 复制代码 代码如下: case KEY.DOWN: event.preventDefault(); if ( select.visible() ) { select.next(); } else { onChange(0, true); } break; 在select.

SpringBoot Mybatis Plus公共字段自动填充功能

一.应用场景 平时在建对象表的时候都会有最后修改时间,最后修改人这两个字段,对于这些大部分表都有的字段,每次在新增和修改的时候都要考虑到这几个字段有没有传进去,很麻烦.mybatisPlus有一个很好的解决方案.也就是公共字段自动填充的功能.一般满足下面条件的字段就可以使用此功能: 这个字段是大部分表都会有的. 这个字段的值是固定的,或则字段值是可以在后台动态获取的. 常用的就是last_update_time,last_update_name这两个字段. 二.配置MybatisPlus 导包:

asp.net+ajax+sqlserver自动补全功能实现解析

代码下载 说明:数据库连接字符串在web.config文件中,为方便运行使用的是官方的Northwind数据库. 参考(向其作者致敬): ² http://www.loveweb8.com/plus/demo.php?aid=57这个例子是html源码.利用jquery.autocomplete插件利用js实现了自动补全功能.由于我的需要是结合sqlserver数据库表实现自动补全功能.就下来就是将数据库表转为js数组,自然而然就想到了ajax. ² Asp.NetAjax的两种基本开发模式这篇

实例详解MyBatis-plus自动填充功能

目录 什么是自动填充 1.这个功能是做什么的呢? 2.下面用一个例子来学习这个功能 3.测试 4.结果 什么是自动填充 有些表中会有更新时间.创建时间.更新人或者创建人这些字段. 每次对数据进行新增.删除.修改时都需要对这些字段进行设置.传统的做法是在进行这些操作前,对Entity的字段进行set设置,然后再进行操作.这种做法不仅容易忘记导致出错.而且代码会显得特别冗余. 虽然新增时间和修改时间可以使用数据库的时间,但是新增人和修改人就不能使用这样的功能. 所以MP就提供自动填充的功能,帮助自定