Question

我正在登录，并且每次输入错误的通行证或用户名时都想晃动表格以及错误消息，因此我从网络课程中获得了此代码。但我不知道哪里出了问题。我对编程非常陌生，所以希望有人可以帮助我。

我试图利用互联网上的一些代码，但是没有用。

<script>
$(document).ready(function(){
 $('#login').click(function(){
  var username = $('#username').val();
  var password = $('#password').val();
  if($.trim(username).length > 0 && $.trim(password).length > 0)
  {
   $.ajax({
    url:"login_script.php",
    method:"POST",
    data:{username:username, password:password},
    cache:false,
    beforeSend:function(){
     $('#login').val("connecting...");
    },
    success:function(dataresult)
    {
     
     if(dataresult)
     {
      // $("body").load("view.php").hide().fadeIn(1100);
      location.href = "view.php"; 
     }
     
     else
     {
      var options = {
       distance: '40',
       direction:'left',
       times:'3'
      }
      $("#box").effect("shake", options, 800);
      $('#login').val("Login");
      $('#error').html("<span class='text-danger'>Invalid username or Password</span>");
   
     }
    }
   });
  }
  else
  {
 $('#error').html("<span align-items-center class='text-danger'>Password and Username is Required</span>");
  }
 });
});
</script>

<?php
//index.php
session_start();
if(isset($_SESSION["username"]))
{
 header("location:index.php");
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
 
   
   
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Registrar System</title>


         <?php
             $con=mysqli_connect("localhost","root","","ojtregistrar");
    // Check connection
           if (mysqli_connect_errno())
           {
          echo "Failed to connect to MySQL: " . mysqli_connect_error();
        }
          ?>
          
</head>

<body>

  <div class="container-scroller id="box"">
    <div class="container-fluid page-body-wrapper full-page-wrapper">
      <div class="content-wrapper d-flex align-items-center auth">
        <div class="row w-100" >
          <div class="col-lg-4 mx-auto">
            <div class="auth-form-light text-left p-5"  >
              <div class="brand-logo">
                <img src="../../images/logo.svg">
              </div>
           
              <h6  class="text-info" style="color:blue;" class="font-weight-light">Sign in to continue.</h6>
              <form  method="POST">
                <div class="form-group">
                  <input type="text" class="form-control form-control-lg text-info" id = "username" name ="username" placeholder="Username">
                </div>
                <div class="form-group">
                <input type="password" class="form-control form-control-lg text-info" id = "password" name ="password"  placeholder="Password">
                </div>
                <div class="mt-3">
              <input type="button" value="Sign in" name="login" id="login"  class="btn btn-info btn-block btn-icon-text">                      
                         
                        
                </div>
                <div class="my-2 d-flex justify-content-between align-items-center">
                  <div id="error"></div>
                </div>
               
              </form>
            </div>
          </div>
        </div>
      </div>

    </div>
 
  </div>

</body>

</html>

我的log.in上的摇动屏幕和错误消息不起作用

0 个答案: