前端 js 實現簡單 表單提交


1. 登錄頁 驗證用戶身份,登錄成功之后等待一定秒數,跳轉到操作頁面

<html> 
  <head> 
    <title>Login.html</title> 
     
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
    <meta http-equiv="description" content="this is my page"> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
     
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
    <script type="text/javascript"> 
      function checkuser() { 
         if($('uname' == "lala") && $('pwd') == "123") { 
           return true; 
         }else { 
            return false; 
         } 
      } 
       
      function $(id) { 
        return document.getElementById(id).value; 
      } 
     </script> 
  </head> 
   
  <body> 
    <form action="ok.html"> 
      u:<input type="text" id="uname"/><br> 
      p:<input type="password" id="pwd"/><br> 
      <input type="submit" value="登錄" onclick="return checkuser()"/> 
    </form> 
  </body> 
</html> 

2. 登錄成功頁面中,等待5秒

<html> 
  <head> 
    <title>ok.html</title> 
     
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
    <meta http-equiv="description" content="this is my page"> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
     
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
    <script type="text/javascript"> 
        function tiao() { 
          clearInterval(mytime); 
          window.open("manage.html","_self"); 
        } 
         
        setTimeout("tiao()",5000); 
         
        function changeSec() { 
           //得到myspan值 
           $('myspan').innerText=$('myspan').innerText-1; 
        } 
         
         function $(id) { 
        return document.getElementById(id); 
      } 
        var mytime = setInterval("changeSec()",1000); 
    </script> 
  </head> 
   
  <body> 
    登錄成功,<span id="myspan">5</span>秒后自動跳轉到管理頁面 
  </body> 
</html> 

3. 寫一個manage.html 即可


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM