【发布时间】：2018-06-11 11:32:22
【问题描述】：
我创建了一个运行良好的登录页面，但我面临的问题是我输入了无效的用户名、名称或密码。
它应该在不加载页面的情况下显示"invalid username or password"，这就是使用AJAX对吗？但是，当我输入无效的用户名或密码时，通过加载页面会显示用户名或密码无效的错误，这在 AJAX 的情况下是不可接受的。
谁能帮我解决这个问题，即在不重新加载页面的情况下显示错误消息？
login.php：
<?php
session_start();
$mysqli = mysqli_connect("localhost","root","","ajax1");
if (isset($_SESSION['id'])){
header('location:welcome.php');
}
?>
<!DOCTYPE HTML>
<html>
<head>
<title> login script with ajax</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>
<body style="background-color:#b3ffff">
<div style="padding-left:500px ; padding-top:200px">
Username: <input id="username" type="text" name="username" placeholder="username"><br><br>
Password: <input id="password" type="password" name="password" placeholder="Password"><br><br>
<input id="submit" name="submit" type="button" value="Log In">
<p style="color:black">Havent Registered Yet? <a href="index.php">Register</a>.</p><br><br>
<div id="display" style="color:red"></div>
<script>
$(document).ready(function(){
$("#submit").click(function(){
var username = $("#username").val();
var password = $("#password").val();
var datastring = 'username=' + username + '&password=' + password;
if(username=='' || password==''){
$("#display").html("Please Enter All The Fields");
}
else{
$.ajax({
type: "POST",
url: "success.php",
data: datastring,
cache: false,
success: function(result){
$("#display").html(result);
window.location = "welcome.php";
}
});
}
return false;
});
});
</script>
</div>
</body>
</html>
success.php：
<?php
$mysqli = mysqli_connect("localhost","root","","ajax1");
session_start();
if (isset($_SESSION['id'])){
header('location:welcome.php');
}
$myusername = mysqli_real_escape_string($mysqli,$_POST['username']);
$mypassword = mysqli_real_escape_string($mysqli,$_POST['password']);
$sql = "SELECT * FROM users WHERE username = '$myusername'";
$result = mysqli_query($mysqli,$sql);
$row = mysqli_fetch_array($result);
$hashed_password=$row['password'];
if(password_verify($mypassword, $hashed_password)) {
$_SESSION['login_user'] = $myusername;
$_SESSION['id']=$row['userid'];
echo'Successfully Registered';
exit();
}
else
{
echo'Invalid username or password';
}
?>
welcome.php：
<?php
session_start();
if (!isset($_SESSION['id'])) {
header('location:login.php');
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div style="Padding-left:200px; padding-top:100px">
<?php
$mysqli = mysqli_connect("localhost","root","","ajax1");
$query=mysqli_query($mysqli,"select * from `users` where userid='".$_SESSION['id']."'");
$row=mysqli_fetch_array($query);
echo 'Welcome - '.$row['username'];
?>
<br><br>
<a href="logout.php">Logout</a>
<br><br>
<div class="panel panel-primary" style="width:56%">
<div class="panel-heading text-center">STUDENT'S DETAILS</div>
</div>
<div class="container text-center">
<?php
$mysqli = mysqli_connect("localhost","root","","ajax1");
if (!isset($_POST["happy"])) {
$result = mysqli_query($mysqli, "SELECT * FROM users");
} else {
$search = mysqli_real_escape_string($mysqli, $_POST["happy"]);
$result = mysqli_query($mysqli, "SELECT * FROM users where department like '%$search%'");
} if(mysqli_num_rows($result) > 0) {
echo "<table border='1' class='text-center' >
<tr>
<th>USER_ID</th>
<th>USERNAME</th>
<th>E-MAIL</th>
<th>NAME</th>
<th>AGE</th>
<th>DATE_OF_BIRTH</th>
<th>DEPARTMENT</th>
</tr>";
while($row = mysqli_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['userid'] . "</td>";
echo "<td>" . $row['username'] . "</td>";
echo "<td>" . $row['email'] . "</td>";
echo "<td>" . $row['name'] . "</td>";
echo "<td>" . $row['age'] . "</td>";
echo "<td>" . $row['date_of_birth'] . "</td>";
echo "<td>" . $row['department'] . "</td>";
echo "</tr>";
}
echo "</table>";
}
else{
echo 'Sorry no record found';
}
?>
</div>
<div class="container form-group">
<br><br>
<form method="post">
<label class="control-label" style="color:blue">Select :</label>
<select name="happy" style="margin-left:14px; color:black;">
<option disabled selected value> -- select an option -- </option>
<option value="EE">Electrical & Electronics</option>
<option value="EC">Electronics & Communication</option>
<option value="ME">Mechanical</option>
<option value="CS">Computer Science</option>
<option value="CV">Civil</option>
<option value="IS">Information Science</option>
</select>
<input type="submit" value="submit">
</form>
</div>
</div>
</body>
</html>
【问题讨论】：
-
离题但你应该看看this other post
-
您正在加载错误消息，并且在更改页面后立即
-
如果我输入任何无效的用户名或密码，它应该在不加载页面的情况下显示错误消息无效的用户名或密码，而是通过加载页面显示
-
寻求调试帮助的问题（“为什么这段代码不起作用？”）必须包括所需的行为、特定的问题或错误以及重现它所需的最短代码在问题本身。没有明确问题陈述的问题对其他读者没有用处。请参阅：How to create a Minimal, Complete, and Verifiable example。我投票结束。