<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单正则验证</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
body{
background: #eee;
}
a{
text-decoration: none;
}
ul,ol{
list-style: none;
}
#Msg-form{
width: 700px;
border: 1px solid #e5e5e5;
border-radius: 10px;
background: #44D0F6;
margin: 0 auto;
}
#top{
width: 100%;
height: 12px;
padding: 10px 10px 20px 10px;
border-bottom: 1px dashed #e4e4e4;
}
#top h3{
width: 12%;
float: left;
text-align: center;
line-height: 30px;
}
#top span{
float: left;
color: #FDA010;
border: 1px solid #FDA010;
font-size: 14px;
line-height: 20px;
padding: 2px 8px;
}
#top a{
float: right;
text-align: center;
color: #fff;
background: #F95050;
line-height: 20px;
padding: 2px 8px;
border-radius: 10px;
font-size: 14px;
}
#box{
padding: 0px 20px ;
overflow: hidden;
}
#box div{
margin: 30px;
height: 21px;
}
#box div label{
float: left;
font-size: 14px;
text-align: right;
}
#box div span{
float: left;
color: red;
text-align: left;
width: 30%;
height: 21px;
}
#box div input{
float: left;
border: 0;
height: 21px;
width: 200px;
font-size: 10px;
padding:2px 8px;
background: #eee;
border-radius: 5px;
}
em{
color: red;
font-weight: 900;
}
#reset{
margin: 0 30px;
}
#last{
width: 500px;
text-align: center;
}
</style>
</head>
<body>
<form action="javascript:;" id="Msg-form">
<div id="top">
<h3>注册账号</h3>
<span>*号为必填项!</span>
<a href="#">反馈意见</a>
</div>
<div id="box">
<div id="login-Id">
<label for="Id">登录账号</label>
<span>*</span>
<input type="text" id="Id" placeholder="字母开头数字下划线组成" required>
<em></em>
</div>
<div id="login-Name">
<label for="Name">你的昵称</label>
<span></span>
<input type="text" id="Name" placeholder="中英文皆可">
<em></em>
</div>
<div id="login-Email">
<label for="Email">你的邮箱</label>
<span>*</span>
<input type="text" id="Email" placeholder="格式:2438387860@qq.com" required>
<em></em>
</div>
<div id="login-Password">
<label for="Password">设置密码</label>
<span>*</span>
<input type="password" id="Password" placeholder="英文字母/数字/特殊字符" required>
<em></em>
</div>
<div id="login-CheckPassword">
<label for="CheckPassword">确认密码</label>
<span>*</span>
<input type="password" id="CheckPassword" required>
<em></em>
</div>
<div id="login-CheckPassword">
<div id="left"></div>
<div id="strong"></div>
</div>
<div id="last">
<input id="btn" type="submit" value="提交">
<input type="reset" id="reset">
</div>
</div>
<input id="day" type="checkbox"><label for="">10天内免登陆</label>
</form>
<script src="form.js"></script>
</body>
</html>
 
js如下:
function $(id){
return document.getElementById(id);
}
var oId = $('Id');
var sId = oId.value;
var oMsg = $('Msg-form');
var oName = $('Name');
var oEmail = $('Email');
var oPassword = $('Password');
var oCheckPassword = $('CheckPassword');
var str = document.getElementsByTagName('em');
oMsg.onsubmit = function(){
// 账号判断
var sId = oId.value;
var regId = /^[a-zA-Z0-9_]\w{4,15}$/;
if(regId.test(sId)){
str[0].innerHTML = '√';
} else{
str[0].innerHTML = '×';
}
// 判断中英文
var sName = oName.value;
var regName = /^[\u2E80-\u9FFF]+$/;
if(regName.test(sName)){
str[1].innerHTML = '√';
} else{
str[1].innerHTML = '×';
} // 判断邮箱
var sEmail = oEmail.value;
var regEmail = /^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/;
if(regEmail.test(sEmail)){
str[2].innerHTML = '√';
}else{
str[2].innerHTML = '×';
} // 判断密码
var sPassword = oPassword.value;
var regPassword = /^[a-zA-Z0-9]\w{3,15}$/;
if(regPassword.test(sPassword)){
str[3].innerHTML = '√';
}else{
str[3].innerHTML = '×';
}
// 判断再次输入的密码是否和上一次一致 var sCheckPassword = oCheckPassword.value;
if(sCheckPassword === sPassword){
str[4].innerHTML = '√';
}else{
str[4].innerHTML = '×';
}
function setCookie(name,value,days,path){
days = days || 0;
path = path || '/';
var oDate = new Date();
oDate.setDate(oDate.getDate() + days);
document.cookie = name + '=' + encodeURIComponent(value) + ';expires=' + oDate + ';path=' + path;
}
var oDay = $('day');
if(oDay.checked){
setCookie('username',sId,10);
setCookie('pwd',sPassword,10);
}
}
 
// 设置cookie
// 封装
 

js之10天内免登陆的更多相关文章

  1. JavaWeb 08_JSP+Dao+Bean+Servlet 实现登录注册(连接数据库,验证码登录,两周内免登陆等功能)

    一.数据库db_01   表usert   字段username,password 二. 目录 三. 配置信息 四. 代码 index.jsp <script type="text/j ...

  2. cookie应用(一周内免登陆)

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  3. JS脚本实现CSDN免登陆免关闭广告插件自动展开“阅读更多”内容

    最近在CSDN查资料,总是弹出以下弹窗,然后就自动跳转到登录页面,蛋疼! 于是重新捣腾了一下,修改了原来的脚本,最新的脚本代码如下: 温馨提示:在打开CSDN页面后立刻执行以下脚本即可免登陆免关闭广告 ...

  4. [linux]阿里云主机的免登陆安全SSH配置与思考

    公司服务器使用的第三方云端服务,即阿里云,而本地需要经常去登录到服务器做相应的配置工作,鉴于此,每次登录都要使用密码是比较烦躁的,本着极速思想,我们需要配置我们的免登陆. 一 理论概述 SSH介绍 S ...

  5. JAVAEE_Servlet_22_Cookie实现十天内免登录

    Cookie实现十天内免登录 代码: - CheckLogin 查看是否获取到了Cookie,如果获取到了连接数据库验证Cookie发过来的用户名和密码,如果没有获取到Cookie信息,那么就跳转到登 ...

  6. 2015.4.21 实现一般免登陆,微博QQ分享,字体自适应等

    1.实现一般的登录验证和免登陆: 解决方法:node方法代码,nodeJS实现的session模块,不完整,但能用,仅供参考. 语言无所谓,session的机制都是一样的,实现不一样而已,:   2. ...

  7. 项目总结之Oauth2.0免登陆及相关知识点总结

    简介Oauth2.0授权步骤 授权码模式的基本步骤 原文链接地址 (A)用户访问客户端,后者将前者导向认证服务器. (B)用户选择是否给予客户端授权. (C)假设用户给予授权,认证服务器将用户导向客户 ...

  8. Mac OS X上如何实现到Linux主机的ssh免登陆

    转载说明: 本文转载自 http://www.aips.me/mac-key-ssh-login-linux.html 生成密钥对 用密码登录远程主机,将公钥拷贝过去 done 第一步:生成密匙对执行 ...

  9. 钉钉微应用接入钉钉免登陆配置记录。NET实现

    在这里记录一下我配置的钉钉接入微应用遇到的坑.搞了我几天天才调通.头皮发麻,现在梳理一下,以免别人也入坑. 1.钉钉接入主要要获取钉钉企业员工的ID,然后去自己的应用的数据库里进行匹配然后实现免登陆的 ...

随机推荐

  1. Linux命令:chmod、chgrp、chown的区别

    chmod是更改文件的权限: chgrp只是更改文件的属组: chown是更改文件的属主与属组. 1.chmod:更改文件的权限 文件权限的设置方式有两种,分别是数字和标记. mode : 权限设定字 ...

  2. 如何打开windows的远程桌面

    WINDOWS 2003/XP 系列设置方法 右键点击[我的电脑]选择[属性],进入[系统属性]界面,点击[远程]选项卡,勾选[启用这台计算机上的远程桌面]即可. 2003/XP系统默认只允许计算机a ...

  3. Linux基础知识点

    1.目录结构 bin 存放二进制可执行文件(ls,cat,mkdir等) boot 存放用于系统引导时使用的各种文件 dev 用于存放设备文件 etc 存放系统配置文件 home 存放所有用户文件的根 ...

  4. codeforces Round#429 (Div2)

    2017-08-20 10:00:37 writer:pprp 用头文件#include <bits/stdc++.h>很方便 A. Generous Kefa codeforces 84 ...

  5. Python学习札记(二十) 函数式编程1 介绍 高阶函数介绍

    参考: 函数式编程 高阶函数 Note A.函数式编程(Functional Programming)介绍 1.函数是Python内建支持的一种封装,我们通过一层一层的函数调用把复杂任务分解成简单的任 ...

  6. LA 3295 数三角形

    https://vjudge.net/problem/UVALive-3295 题意: 数出n行m列的网格顶点能组成多少个三角形. 思路: 直接去数的话比较麻烦,这道题目是可以重复的,只要位置不同就可 ...

  7. python UI自动化测试

    为了减小维护成本: 1.UI自动化测试需要有较为稳定的环境 2.代码设计合理,那么我们就需要面向对象的设计一个框架,将重复的代码模块化 一.首先总结一下 UI自动化大概要哪些模块 1.config(配 ...

  8. 搞懂分布式技术6:Zookeeper典型应用场景及实践

    搞懂分布式技术6:Zookeeper典型应用场景及实践 一.ZooKeeper典型应用场景实践 ZooKeeper是一个高可用的分布式数据管理与系统协调框架.基于对Paxos算法的实现,使该框架保证了 ...

  9. 编写3ds max插件时遇到的问题总结

    本文为大便一箩筐的原创内容,转载请注明出处,谢谢:http://www.cnblogs.com/dbylk/ 这几天在给公司的美术编写3ds max 2009使用的插件,遇到了一些问题,在此记录一下解 ...

  10. 创建自定义JSR303的验证约束(Creating custom constraints)

    转载:http://clongjava.iteye.com/blog/1317649 由于输入验证在软件开发中是必须的一件事情,特别是与用户交互的软件产品,验证用户的潜在输入错误是必不可少的一件事情, ...