JS--功能合集--登录及时格式验证

_Jason_

浏览: 42859 次
性别:
来自: 北京

最近访客更多访客>>

进两步

hejuly

wenjiefeng

dongboy

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

JavaScript

javascript 功能合集

    总结一个通用的登录验证,并且是及时的哟！之前在网上找的很多都不是及时的,那种方式的验证已经不能适用于现在的Web了~~~
-------------------------------Login验证------------------------------
验证：
      用户名 username
      密码   upwd
-------------------------------login.jsp------------------------------
<script>
//及时验证-验证账号
function checkusername()
{
   //得到表单中的用户名
   var username = document.getElementById("username").value;
   var reg=/^[a-zA-Z0-9_]+$/; //正则表达式,根据实际要求更改
   //格式不符提示
   if(username .length !=6||!reg.test(username)||username ==null||username.length==0)
   {
       document.getElementById("username_info").innerHTML = "<font size=2 color=red>账号格式错误！

       6位数字、字母组合</font>";
    return false;
   }
   else{
      document.getElementById("username _info").innerHTML = "<font size=2 color=grey>（6位数字、字

        母组合）</font>";
    return true;
    }
}
//及时验证-验证密码
function checkupwd()
{
   //得到表单中的密码
   var upwd = document.getElementById("upwd").value;
   //格式不符提示
   if(upwd.length <6||upwd.length>8||upwd==null||upwd.length==0)
   {
       document.getElementById("upwd_info").innerHTML = "<font size=2 color=red>密码格式错误！6~8

         位,数字字母组合</font>";
        return false;
   }

else{

document.getElementById("upwd_info").innerHTML = "<font size=2 color=grey>（6~8位数字、字母

组合）</font>";
return true;

     }

}
//页面加载时输入框后的说明
function onload(){
           document.getElementById("username _info").innerHTML = "<font size=2 color=grey>（6位数字、

字母组合）</font>";
document.getElementById("upwd_info").innerHTML = "<font size=2 color=grey>（6~8位数字、

字母组合）</font>";
}

</script>

<body id="login" onload="onload();">
   <form action="jsp/login_ctrl.jsp" method="post" name="form_login" >

        <font color="white">账号:</font>
        <input type="text" title="账号"name="username"onchange="checkusername();"

onblur="checkusername();"/>
        <!--onchange事件和onblur事件都需要
           onchange--当目标内容发生改变时触发,也就是你填东西后将鼠标移开是触发
           onblur---是当鼠标焦点移开是触发,也就是即使你什么都不填只是点了一下,然后移开鼠标就会触发事件，

因此它俩的结合体验才比较好 -->

        <span id="username_info"></span>
         

        <font color="white">密码:</font>
        <input type="password" title="密码" name="upwd" onchange="checkupwd();"

onblur="checkupwd();" />
         <span id="upwd_info"></span>
         
    </form>
</body>

注：该验证在不触发事件时如果提交是会提交过去的,对于这个不足还希望哪位大神给指导指导啊~不盛感激！！！想达到提交就是有数据的效果,然后再用Ajax进行验证,那就完美不少了~~

0
顶

0
踩

分享到：

常用正则表达式合集~ | JS--功能合集--window.open()弹出窗口加定 ...

2012-11-09 23:56
浏览 2335
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论