Ajax登录问题

时间:2013-08-14 14:26:35

标签: php javascript ajax web

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>

我减少了额外的代码,但是当我点击登录按钮时,网址会更改,但会使用用户名和密码保留在登录页面上,但是没有验证。谢谢你的帮助。

2 个答案:

答案 0 :(得分:1)

调查问题我可以提出一些建议:

  1. 使用表单操作来调用php并进行验证。
  2. 从php本身重定向到下一页

答案 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;
});

});