PHP连接器
// Connect to server and select databse.
mysql_connect($host, $username, $password)or die("cannot connect");
mysql_select_db("$db_name")or die("cannot select DB");
/* escape entered values to prevent sql nastyness */
$username = mysql_real_escape_string($_POST['username']);
$password = mysql_real_escape_string($_POST['password']);
if(!empty($username) && !empty($password)){
/* we query through our database to search for a username that has been entered */
$query = mysql_query("SELECT * FROM $tbl_name WHERE UserLogin = '$username' AND UserPass='$password'");
if(mysql_num_rows($query) == 1){
/* if there is a match with the database, we select the username and password from the database corresponding to the entered username */
while($row = mysql_fetch_assoc($query)){
$db_username = $row['username'];
$db_password = $row['password'];
}
/* we compare the entered username and password with the ones we just selected from the database */
if($username == $db_username && $password == $db_password){
/* If the entered username and password are correct, return 1 */
echo '1';
}
} else {
/* If the entered username or password do not match, return 2 */
echo 'Username or Password are wrong';
}
} else {
/* If both fields are empty, return 3 */
echo 'Username and Password are empty';
}
的Javascript
$(document).ready(function() {
$('#login_form').submit(function() {
$.ajax({
type: "POST",
url: 'php/check_login_online.php',
data: {
username: $("#username").val(),
password: $("#password").val()
},
success: function(data)
{
if (data === '1') {
window.location.replace('php/search.php');
}
else {
alert(data);
}
}
});
});
});
HTML
<div class="container">
<div class="form-bg">
<form id='login_form'>
<h2>test Login</h2>
<p><input name="username" placeholder="Username" type="text" id="username"></p>
<p><input name="password" placeholder="Password" type="password" id="password" ></p>
<label class='error' id='error' style='display: none; font-size: 12px;'></label>
<button type="submit" name="Submit" class="submit" value="Login"></button>
</form>
</div>
<!-- <p class="forgot">Forgot your password? <a href="">Click here to reset it.</a></p> -->
</div>
<!-- JS -->
<script src="js/ajax-login.js"></script>
我减少了额外的代码,但是当我点击登录按钮时,网址会更改,但会使用用户名和密码保留在登录页面上,但是没有验证。谢谢你的帮助。
答案 0 :(得分:1)
调查问题我可以提出一些建议:
答案 1 :(得分:0)
您应该在jQuery提交结束时添加return false
。这将阻止表单的默认操作。
为了使ajax登录工作,这是必要的。
更新了JavaScript代码:
$(document).ready(function() {
$('#login_form').submit(function() {
$.ajax({
type: "POST",
url: 'php/check_login_online.php',
data: {
username: $("#username").val(),
password: $("#password").val()
},
success: function(data) {
if (data === '1') {
window.location.replace('php/search.php');
} else {
alert(data);
}
}
});
return false;
});
});