使登录表单等待,直到验证凭据

时间:2016-02-11 13:53:53

标签: javascript html login

寻找一种方法停留在登录表单页面上,直到输入的凭据被验证或被拒绝,然后相应地采取行动(请参阅JavaScript)。参考this CodePen

登录表格

<div class="background-wrap">
  <div class="background"></div>
</div>

<form id="accesspanel" action="login" method="post">
  <h1 id="litheader">AECEND</h1>
  <div class="inset">
    <p>
      <input type="text" name="username" id="email" placeholder="Email address">
    </p>
    <p>
      <input type="password" name="password" id="password" placeholder="Access code">
    </p>
    <div style="text-align: center;">
      <div class="checkboxouter">
        <input type="checkbox" name="rememberme" id="remember" value="Remember">
        <label class="checkbox"></label>
      </div>
      <label for="remember">Remember me for 14 days</label>
    </div>
    <input class="loginLoginValue" type="hidden" name="service" value="login" />
  </div>
  <p class="p-container">
    <input type="submit" name="Login" id="go" value="Authorize">
  </p>
</form>

的JavaScript

$(document).ready(function() {
    var state = false;
    //$("input:text:visible:first").focus();
    $('#accesspanel').on('submit', function(e) {
        e.preventDefault();
        state = !state;
        if (state) {
            document.getElementById("litheader").className = "poweron";
            document.getElementById("go").className = "";
            document.getElementById("go").value = "Initializing...";
        }else{
            document.getElementById("litheader").className = "";
            document.getElementById("go").className = "denied";
            document.getElementById("go").value = "Access Denied";
        }
    });
})

0 个答案:

没有答案