<!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">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>正则表达式实现表单验证</title>

 </head>

 <body>

     <fieldset style="width:400px;">

         <legend>Xxx网站注册</legend>  

                <table>

                   <tr>

                     <td>用户名:</td>

                     <td><input type="text" id="user"/><span></span></td>

                   </tr>

                   <tr>

                     <td>密码:</td>

                     <td><input type="password" id="pwd" onblur="pwdBlur()" onfocus="pwdFocus()"/><span></span></td>

                   </tr>

                   <tr>

                     <td>确认密码:</td>

                     <td><input type="password" id="repwd"/><span></span></td>

                   </tr>

                   <tr>

                     <td>邮箱:</td>

                     <td><input type="text" id="email"/><span></span></td>

                   </tr>

                   <tr>

                     <td><input type="submit" value="注册"/></td>

                     <td><input type="reset" value="重置"/></td>

                   </tr>

                </table>

     </fieldset>

 <script type="text/javascript">

   function pwdFocus(){

      var pwd=document.getElementById("pwd");

       pwd.style.border="1px blue solid";

       pwd.nextSibling.innerHTML="密码长度必须为6到12";

   }

   function pwdBlur(){

      var pwd=document.getElementById("pwd");

      //获取value属性值方式1

      //var pwdval=pwd.getAttribute("value");

      //获取value属性值方式2

      var pwdval=pwd.value;

      var reg=/^[a-zA-Z0-9]{6,12}$/;

      if(reg.test(pwdval)==false){

         pwd.style.border="1px red solid";

         pwd.nextSibling.innerHTML="密码长度必须为6到12";

      }else{

         pwd.style.border="1px green solid";

         pwd.nextSibling.innerHTML="密码可用";

     }

   }

 </script>

 </body>

 </html>

7、js使用正则表达式验证的更多相关文章

  1. Js用正则表达式验证字符串

    js 常用正则表达式表单验证代码 作者: 字体:[增加 减小] 类型:转载 js 常用正则表达式表单验证代码,以后大家就可以直接使用了. 正则表达式使用详解 简介 简单的说,正则表达式是一种可以用于模 ...

  2. JS和正则表达式验证手机号码、邮箱等

    <-------------------------------------验证手机号码---------------------------------------------> fun ...

  3. 在js中正则表达式验证小时分钟，将输入的字符串转换为对应的小时和分钟

    文章目录 1.预备知识 2.在js中的代码片段 3.测试结果 1.预备知识 splict()方法 Date()的相关方法 setHours()的用法 2.在js中的代码片段 //验证小时和分钟 var ...

  4. js用正则表达式验证用户和密码的安全性，生成随机验证码

    制作了一个表单,表单验证用户.密码.随机验证码 html页面

  5. JS常用正则表达式验证

    一.电话+手机 重点是正则表达式: var myreg=/^[1][3,4,5,7,8][0-9]{9}$/; 表达式的意思是: 1--以1为开头: 2--第二位可为3,4,5,7,8,中的任意一位: ...

  6. JS之正则表达式验证URL

    function IsURL(str_url){ var strRegex = "^((https|http|ftp|rtsp|mms)?://)" + "?(([0-9 ...

  7. js简单正则表达式验证密码

    包含3种及以上 var reg = new RegExp("^(?![A-Za-z]+$)(?![A-Z\\d]+$)(?![A-Z\\W]+$)(?![a-z\\d]+$)(?![a-z\ ...

  8. js手机号正则表达式验证

    var phone = $("#phone").val(); //陈旧版 var parphone = /^(((13[0-9]{1})|(17[0-9]{1})|(15[0-9] ...

  9. js使用正则表达式验证身份证格式

    function checkIdentity(identity){ var reg = /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/; i ...

随机推荐

  1. org.apache.log4j.Logger 详解

    org.apache.log4j.Logger 详解 1. 概述 1.1. 背景    在应用程序中添加日志记录总的来说基于三个目的 :监视代码中变量的变化情况,周期性的记录到文件中供其他应用进行统计 ...

  2. Leetcode-34-Search Insert Position-(Medium)

    二分法查找需要插入的位置,需要注意两点 1.如果元素不存在,停止的时候start Index刚好是需要插入的位置 2.如果元素存在,需要向前追溯找到非目标元素的起始边界 #!/usr/local/bi ...

  3. 开通域名绑定DDNS

    一.初衷 我想要有一个自己的域名,然后有自己的server,在server上搭一个网站或者开通一个ftp服务,我想通过这个域名来访问它. 二.什么是DDNS DDNS 动态dns,电信宽带采用拨号联网 ...

  4. break位于内循环。作用于外循环

    outer:for(int i = 0; i < 4; ++i)  {       inner:for(int j = 0; j < 4; ++j)       {           S ...

  5. jQuery Validate【强大的表单验证】

    一.引入菜鸟教程提供的 1.14.0 版本下载地址:http://static.runoob.com/download/jquery-validation-1.14.0.zip <script ...

  6. background-size （设置背景图片的大小）

    设置背景图片的大小,以长度值或百分比显示(数值包括 长度length和百分比percentage),还可以通过cover和contain来对图片进行伸缩. 语法:background-size: au ...

  7. 利用rabbit_mq队列消息实现对一组主机进行命令下发

    目的: 利用rabbit_mq队列消息实现对一组主机进行命令下发 server: #!/usr/bin/env python3.5 # -*- coding:utf8 -*- import os,sy ...

  8. SURF 特征法

    public static void FindMatch(Mat modelImage, Mat observedImage, out long matchTime, out VectorOfKeyP ...

  9. 基于clip-path的任意元素的碎片拼接动效(源自鑫空间)

    一.实现原理. 效果本质上是CSS3动画,就是旋转transform:rotate和位移:transform:translate,只是旋转和位移的部件是三角碎片而已.三角是使用CSS3 clip-pa ...

  10. sql优化方式-转载

    我始终认为,一个系统的性能的提高,不单单是试运行或者维护阶段的性能调优的任务,也不单单是开发阶段的事情,而是在整个软件生命周期都需要注意,进行有效工作才能达到的.所以我希望按照软件生命周期的不同阶段来 ...