注册文件 reg.html

<html>
<style>
　　#btn{
　　　　background-color: red;
　　　　color:white;
　　　　width: 235px;
　　　}
　　span{
　　　　color: red;
　　}
</style>
<center>
　　<form action="doreg.php" method="post" >
　　<table>
　　　　<tr>
　　　　　　<td>用户名</td>
　　　　　　<td>
　　　　　　　　<input type="text" name="username" onblur="check_user()">
　　　　　　　　<span id='username'></span>
　　　　　　</td>
　　　　</tr>
　　　　<tr>
　　　　　　<td>密码</td>
　　　　　　<td>
　　　　　　　　<input type="password" name="pwd" onblur="check_pwd()">
　　　　　　　　<button onclick="return showpwd()">显示密码</button>
　　　　　　　　<span id='pwd'></span>
　　　　　　</td>
　　　　</tr>
　　　　<tr>
　　　　　　<td>确认密码</td>
　　　　　　<td><input type="password" name="repwd" onblur="check_repwd()">
　　　　　　<span id='repwd'></span>
　　　　　　</td>
　　　　</tr>
　　　　<tr>
　　　　　　<td>手机号</td>
　　　　　　<td>
　　　　　　　　<input type="text" name="tel" onblur="check_tel()">
　　　　　　　　<span id='tel'></span>
　　　　　　</td>
　　　　　　</tr>
　　　　　　<tr>
　　　　　　　　<td>验证码</td>
　　　　　　　　<td>
　　　　　　　　　　<input type="code" name="code">
　　　　　　　　　　<button onclick="return reflush()">刷新验证码</button>
　　　　　　　　　　<span id='code'></span>
　　　　　　　　</td>
　　　　　　</tr>
　　　　</table>
　　　　<input type="checkbox" name="agree">我已阅读并同意 <br>
　　　　<button id="btn" onclick="return checkall()">立即注册</button>
　　</form>
</center>
</html>
<script>
// 验证码
　　window.onload=function(){
　　　　reflush();
　　}
　　function reflush(){
　　　　var randnum = 1000+Math.floor(Math.random()*9000)
　　　　document.getElementById('code').innerHTML=randnum;
　　　　return false;
　　}
// 显示密码
　　function showpwd(){
　　　　node = document.getElementsByName('pwd')[0];
　　　　node.type = "text";
　　　　return false;
　　}
// 验证用户名
　　function check_user() {
　　　　var username = document.getElementsByName('username')[0].value;
　　　　var ptn_username = /^[(\u4e00-\u9fa5)||\w]{6,10}$/i;
　　　　if (!username.match(ptn_username)) {
　　　　　　document.getElementById('username').innerHTML='用户名格式不正确';
　　　　　　return false;
　　　　}
　　　　document.getElementById('username').innerHTML='';
　　　　return true;
　　}
// 验证密码
　　function check_pwd() {
　　　　var pwd = document.getElementsByName('pwd')[0].value;
　　　　var ptn_pwd = /^\w{6,10}$/i;
　　　　if (!pwd.match(ptn_pwd)) {
　　　　　　document.getElementById('pwd').innerHTML='密码格式不正确';
　　　　　　return false;
　　　　}
　　　　document.getElementById('pwd').innerHTML='';
　　　　return true;
　　}
// 两次密码一致
　　function check_repwd(){
　　　　var pwd = document.getElementsByName('pwd')[0].value;
　　　　var repwd = document.getElementsByName('repwd')[0].value;
　　　　if (pwd!=repwd) {
　　　　　　document.getElementById('repwd').innerHTML='两次密码不一致';
　　　　　　return false;
　　　　}
　　　　document.getElementById('repwd').innerHTML='';
　　　　return true;
　　}
// 验证手机号
　　function check_tel() {
　　　　var tel = document.getElementsByName('tel')[0].value;
　　　　var ptn_tel = /^1[35789]\d{9}$/i;
　　　　if (!tel.match(ptn_tel)) {
　　　　　　document.getElementById('tel').innerHTML='手机号格式不正确';
　　　　　　return false;
　　　　}
　　　　document.getElementById('tel').innerHTML='';
　　　　return true;
　　}
// 阅读协议
　　function check_agree(){
　　　　var flag = document.getElementsByName('agree')[0].checked;
　　　　if(!flag){
　　　　　　alert('请先阅读注册说明书');
　　　　}
　　　　return flag;
　　}

// 刷新产生验证码
　　function check_code(){
　　　　var code = document.getElementsByName('code')[0].value;
　　　　var span_code = document.getElementById('code').innerHTML;
　　　　if (!code) {
　　　　　　alert('请点击刷新生成验证码')
　　　　}
　　　　if (code!=span_code) {
　　　　　　alert('验证码不正确')
　　　　　　return false;
　　　　}
　　　　return true;
　　}

// 表单提交
　　function checkall(){
　　　　var check = check_code()&&check_user()&&check_pwd()&&check_repwd()&&check_tel()&&check_agree();
　　　　return check;
　　}
</script>

原始js---JavaScript注册用正则验证用户名密码手机号邮箱验证码的更多相关文章

  1. Ajax实现注册无刷新验证用户名是否存在

    1. [代码][JavaScript]代码     ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 ...

  2. 模拟js中注册表单验证

    示例1 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  3. 记录下 js各种证件的正则验证

    身份证 /(^\d{15}$)|(^\d{17}([0-9]|X)$)/    护照 /^[a-zA-Z0-9]{3,21}$/   /^(P\d{7})|(G\d{8})$/    军官证或士兵证 ...

  4. Javascript 正则验证带 + 号的邮箱地址

    很多邮箱地址是可以加上 + 加号为同一个邮箱地址. 比如 Gmail. 如果需要验证带 + 号的邮箱,如下: str = "65485+55@gmail.com"; documen ...

  5. php ajax 同时验证 用户名 密码

    今天写了一个程序分享给大家,该程序是ajax密码和用户名验证问题 第一步 先在数据库里建立一张表 有3个字段 为 id name pass 第二步 写html页面,需要引入jq库 请到官网自行下载 & ...

  6. java在线聊天项目 客户端登陆窗口LoginDialog的注册用户功能 修改注册逻辑 增空用户名密码的反馈 增加showMessageDialog()提示框

    LoginDialog类的代码修改如下: package com.swift.frame; import java.awt.EventQueue; import java.awt.event.Acti ...

  7. ajax异步验证用户名密码，提示路径错误

    使用thinkphp框架异步验证用户名和密码的时候,ajax路径错误可能有多重情况.我遇到的是,我自感路径没问题,且先前使用无错.由于多人合作使用svn,所以在更新代码后,使用firebug显示一直是 ...

  8. javaweb从mysql中获取数据验证用户名密码成功跳转，失败重新验证

    要求:validate.jsp页面中获取请求参数(request.getparameter(“name属性的值”)),注意中文参数获取之前要设置请求编码(request.setCharaterEnco ...

  9. 04 . Go+Vue开发一个线上外卖应用(用户名密码和图形验证码)

    图形化验证码生成和验证 功能介绍 在使用用户名和密码登录功能时,需要填写验证码,验证码是以图形化的方式进行获取和展示的. 验证码使用原理 验证码的使用流程和原理为:在服务器端负责生成图形化验证码,并以 ...

随机推荐

  1. C#用mouse_event模拟鼠标点击的问题

    1.首先添加using System.Runtime.InteropServices; 2.为鼠标添加模拟点击的各种参数 //鼠标事件  因为我用的不多,所以其他参数没有写 1 2 3 4 5 6 7 ...

  2. SpringBoot第七篇：整合Mybatis-Plus

    作者:追梦1819 原文:https://www.cnblogs.com/yanfei1819/p/10881666.html 版权声明:本文为博主原创文章,转载请附上博文链接! 引言   一看这个名 ...

  3. Laravel本地环境搭建：Homestead开发环境的部署

    Laravel框架在php开发过程是不断进行优化的,当然也包括了本地环境的开发,下面我们就来具体看看laravel框架中的Homestead 开发环境的部署内容. 首先白以下几个概念 VirtualB ...

  4. SQL -------- WHERE子句与AND，OR和NOT运算符结合使用。

    AND, OR and NOT  与 运算符中的且或非的意思相同 WHERE子句可以与AND,OR和NOT运算符结合使用. and 表示 查询的语句必须全部包含and 连接的两个或多个条件 or    ...

  5. 【mysql】windows7 安装mysql5.7 解压缩版 + windows7 安装mysql5.7报错 计算机丢失了MSVCR120.dll解决方法

    1.下载mysql 5.7的zip版解压缩的安装包 在mysql官网:http://dev.mysql.com/downloads/mysql/ 2.解压到本地任意目录,并创建一个mysql_data ...

  6. winform按钮美化（非图片）

    在开发过程中,突然发现vs自带的按钮属性中通过修改Button控件的BackColor的颜色和字体颜色(ForeColor属性)及大小,如下图 就能达到简单美化按钮的效果,下面是显示效果 有兴趣的同学 ...

  7. 脱离Office约束,C#结合Mpxj组件完美解析MSProject(.mpp)文件

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  8. php封装协议的两道题

    这几天终于刷完了自己说是要刷完的那几道题,赶紧写几篇博客记录.. 1.  先看看这个网站:https://blog.csdn.net/qq_41289254/article/details/81388 ...

  9. android studio学习----添加项目库

    Library Project(库项目) compile project(':library') 引用名称为 library 的 module .需要注意的是,被引用的 module 需要在 {@pr ...

  10. Centos7配置ssh免密登录群发

    ssh免密登录是客户端发送自己的公钥到服务器.用公钥进行解密,自己生成的私钥进行加密. 首先在客户端查看sshd服务是否启动 [zhiwei@zhiwei1 ~]$ ps -Af|grep sshd; ...