• 做一个帐号密码登录界面


    <body>

    <!--以下为登录界面内容-->

         <input type="text" id="zh" value="请输入帐号" onclick="f(); d()" bs="0"/><br />

         <input type="text"  id="mm" value="请输入密码" onclick="e()" /><br/>

         <input type="button" value="登录(10)"  id="dl0" onclick="c()" disabled="disabled"/>

       </body>

       <script type="text/javascript">

         var a = document.getElementById("zh");

         var b = document.getElementById("mm");

         var dl = document.getElementById("dl0");          //首先转成dom对象

         var i =10;

         function f(){

               if(i>=0){

               dl.value="登录("+i+")";

               i--;

               setTimeout("f()",1000)

               }                        //设置登录按钮样式,每隔一秒减1,初始为10,10s后字样消失

               else if(i<0){

                 dl.value="登录";

                 dl.removeAttribute("disabled")

               }

         }

         function d(){

            a.value="";

            a.style.backgroundColor=""

         }                    //清空上一次登录失败后留下的痕迹

         function e(){

            b.value="";

            b.type="password";

            b.style.backgroundColor=""

         }

         function c(){                //验证帐号密码正确与误

            if(a.value=="administrator"&&b.value=="password"){

               alert("登录成功")

            }

             else {

                  if(a.value=="") {

                 a.style.backgroundColor="red";

                 alert("帐号不能为空")

                 }

                 else if(a.value!="administrator"){

                    a.style.backgroundColor="red";

                    alert("帐号错误");

                 }

                 else if(b.value!="password"){

                    b.style.backgroundColor="red";

                    alert("密码错误");

                 }

                 i=10;

                 dl.setAttribute("disabled","disabled")

                  }

         }

       </script>

  • 相关阅读:
    THINKPHP3.2视频教程
    PHPCMS 学习
    PHPCMS 后台学习
    phpcms 模板学习
    二叉树的创建与遍历(链式存储)
    MySQL基础~~增、删、改、简单查
    队列的基本操作(链队列)
    MySQL基础~~表结构操作
    行编辑程序
    循环链表的基本操作
  • 原文地址:https://www.cnblogs.com/quanjunkang/p/10225091.html
Copyright © 2020-2023  润新知