js注册登录校验
2016-12-07 21:26
393 查看
先上代码。
4000
/div>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Form表单提交</title> <script type="text/javascript"> var flag1=false; var flag2=false; function display(obj){ var currentVal=$(obj.id).value; if(currentVal=="") { $(obj.id).value=obj.defaultValue; } else{ $(obj.id).value=currentVal; if(currentVal.length<6) { $("info1").innerText="用户名称太短,应为6-10个字符"; } else if(currentVal.length>10) { $("info1").innerText="用户名称太长,应为6-10个字符"; } else { var myreg=/[a_zA_z0-9_-]+/gi; if(!myreg.test(currentVal)) { $("info1").innerText="用户名不能为除下划线之外的特殊字符"; } else { flag1=true; } } } $("b3").disabled=false; } function dispass(obj){ var currentVal=$(obj.id).value; if(currentVal=="") { $(obj.id).value=obj.defaultValue; } else{ $(obj.id).value=currentVal; if(currentVal.length<6) { $("info2").innerText="密码太短"; } else if(currentVal.length>16) { $("info2").innerText="密码太长"; } else { var myreg=/[a_zA_z]+[0-9]+/gi; if(!myreg.test(currentVal)) { $("info2").innerText="密码应该为字母和数字的组合"; } else { flag2=true; } } } $("b3").disabled=false; } function confirm(obj){ var flag=flag1&&flag2; if(!flag) { $("b3").disabled=true; return false; } return true; } function doclear(obj) { var currentVal=$(obj.id).value; if(currentVal==obj.defaultValue) { $(obj.id).value=""; } else{ $(obj.id).value=currentVal; } } function $(id) { return document.getElementById(id); } function setStyle(x) { document.getElementById(x).style.background="yellow" } </script> </head> <body> <form action="" onsubmit="return confirm(this)"> <!--value 就是默认值 可以通过 this.defaultValue来访问--> <input type="text" value="用户邮箱/手机号/用户名" onfocus="doclear(this)" onblur="display(this)" id="b1"/><span id="info1"></span><br> <input type="password" value="请输入密码" onfocus="doclear(this)" onblur="dispass(this)" id="b2"/><span id="info2"></span><br> <input type="submit" value="登陆" id="b3"/><br> </form> </body> </html><
4000
/div>
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- 只需四个步骤几行代码,即可快速实现直播弹幕功能
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- JavaScript 基础、进阶以及 Ubuntu 系统中的 JavaScript 开发调试工具
- 最后一次说说闭包
- Ajax
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 设计模式---状态模式在web前端中的应用
- 异步流程控制:7 行代码学会 co 模块
- ES6 走马观花(ECMAScript2015 新特性)
- JavaScript拆分字符串时产生空字符的原因
- Canvas 在高清屏下绘制图片变模糊的解决方法