AJAX不返回php的结果

I am trying to learn from an example from online,for a login form with php and jquery and i am using the exactly the same example, but for some reason the AJAX isnt getting anything back but redirecting my to another php. Here is a link of what i had been trying and the problem.

我正在尝试从一个在线的例子中学习，一个使用php和jquery的登录表单，我使用的是完全相同的示例，但是出于某种原因，AJAX并没有得到任何东西，而是重新指向另一个php。这里有一个链接，我一直在尝试和问题。

http://rentaid.info/Bootstraptest/testlogin.html

It supposed to get the result and display it back on the same page, but it is redirecting me to another blank php with the result on it. Thanks for your time, i provided all the codes that i have, i hope the question isnt too stupid.

它应该得到结果并将其显示在同一个页面上，但是它会将结果重定向到另一个空白的php中。谢谢你的时间，我提供了我所有的代码，我希望这个问题不是太愚蠢。

HTML code:

HTML代码:

<!DOCTYPE HTML>
<html>
    <head>
    </head>
    <body>
        <form id= "loginform" class="form-horizontal" action='http://rentaid.info/Bootstraptest/agentlogin.php' method='POST'>
            <p id="result"></p>
            <!-- Sign In Form -->
            <input required="" id="userid" name="username" type="text" class="form-control" placeholder="Registered Email" class="input-medium" required="">
            <input required="" id="passwordinput" name="password" class="form-control" type="password" placeholder="Password" class="input-medium">
            <!-- Button -->
            <button id="signinbutton" name="signin" class="btn btn-success"  style="width:100px;">Sign In</button>
        </form>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javasript" src="http://rentaid.info/Bootstraptest/test.js"></script>
    </body>
</html>

Javascript

Javascript

$("button#signinbutton").click(function() {
    if ($("#username").val() == "" || $("#password").val() == "") {
        $("p#result).html("Please enter both userna");
    } else {
        $.post($("#loginform").attr("action"), $("#loginform:input").serializeArray(), function(data) {
            $("p#result").html(data);
        });
        $("#loginform").submit(function() {
            return false;
        });
    }
});

php

php

<?php
ini_set('display_errors', 1);
error_reporting(E_ALL);
ob_start();
session_start();
include 'connect.php';
//get form data
$username = addslashes(strip_tags($_POST['username']));
$password = addslashes(strip_tags($_POST['password']));
$password1 = mysqli_real_escape_string($con, $password);
$username = mysqli_real_escape_string($con, $username);
if (!$username || !$password) {
    $no = "Please enter name and password";
    echo ($no);
} else {
    //log in
    $login = mysqli_query($con, "SELECT * FROM Agent WHERE username='$username'")or die(mysqli_error());
    if (mysqli_num_rows($login) == 0)
        echo "No such user";
    else {
        while ($login_row = mysqli_fetch_assoc($login)) {

            //get database password
            $password_db = $login_row['password'];

            //encrypt form password
            $password1 = md5($password1);

            //check password
            if ($password1 != $password_db)
                echo "Incorrect Password";
            else {
                //assign session
                $_SESSION['username'] = $username;
                $_SESSION['password'] = $password1;
                header("Location: http://rentaid.info/Bootstraptest/aboutus.html");
            }
        }
    }
}
?>

Edit

编辑

$("button#signinbutton").click(function(){

    if($("#username").val() ==""||$("#password").val()=="")
$("p#result).html("Please enter both userna");
  else


    $.post ($("#loginform").attr("action"),
        $("#loginform:input").serializeArray(),
    function(data)  {
$("p#result).html(data);  });  




});
 $("#loginform").submit(function(){
    return false;
});

3 个解决方案

#1

The reason you are being redirected is that you are also calling $.submit. The classic form submit will redirect you to a new page, which is exactly what you don't want when you're using AJAX. If you remove this call:

您被重定向的原因是您也调用了$.submit。经典的表单submit将把您重定向到一个新页面，这正是您在使用AJAX时不希望看到的。如果您删除此调用:

$("#loginform").submit(function() {
    return false;
});

you probably should have working solution. If not, let me know :)

你应该有可行的解决方案。如果没有，请让我知道:

#2

First of all, Remove :-

首先，删除:-

header("Location: http://rentaid.info/Bootstraptest/aboutus.html");

and if you want to display the data, echo username and password.

如果您想要显示数据，请回显用户名和密码。

$_SESSION['username'] = $username;
$_SESSION['password'] = $password1;
echo $username."<br>".;
echo $password1;

#3

Modify your javascript section so that

修改你的javascript部分

$("button#signinbutton").click(function() {
    if ($("#username").val() == "" || $("#password").val() == "") {
        $("p#result).html("Please enter both userna");
    } else {
        $.post($("#loginform").attr("action"), $("#loginform:input").serializeArray(), function(data) {
            $("p#result").html(data);
        });
    }
});

$("#loginform").submit(function() {
    return false;
});

is outside the function call.

在函数调用之外。

#1