注意：example@abc.com和123存储在Wamp服务器数据库中的电子邮件和密码。

Question

我正在为我的网站开发一个简单的登录表单。为此，我想用ajax连接php来验证用户。但是要做到这一点，我无法从ajax获得输出。

<script>
 function submitForLogin() 
 {  
    $.ajax({
            type: "POST",
            url: "php/login.php",
            data: { email: "example@abc.com",password:"123" }}).done(function(data){alert(data);});

 }

</script>

当用户点击登录按钮时，它会调用submitForLogin（）函数。

以上部分代码已放入我的login.html文件中。为了验证这是否有效，我只是用硬编码值替换了电子邮件和密码的数据值。

注意：example@abc.com和123存储在Wamp服务器数据库中的电子邮件和密码。

这是PHP文件：

<?php
$userEmail=$_POST['email'];
$userPass=$_POST['password'];
$servername ="localhost";
    $username="root";
    $password="";
    $dbname="AS2014459";
    //To create a connection
    $con = mysqli_connect($servername,$username,$password,$dbname); //check connection
    if(!$con){
        die("Connection failed: ".mysqli_connect_error());
    }   
    $sql="SELECT Email,Password FROM USERTABLE WHERE Email='".$userEmail."'";
    $results=mysqli_query($con,$sql);
    if(mysqli_num_rows($results)>0)
    {
        echo "userExist";
    }
    else
    {
        echo "fakeUser";
    }
    mysqli_close($con);



?>

每当我只运行php文件（$ userEmail和$ userPass具有以前的硬编码值）时，php会输出userExist输出。但是使用ajax我无法在警报框中得到它。

我有遗漏的东西吗？我也在wamp服务器上运行网站。

更新

当我查看它显示的控制台错误时;

enter image description here

当我点击login.html第112行时，它会显示;

enter image description here

想法家伙？此外，迄今为止提供的解决方案都没有给我成功回答这个问题。

有一个jquery错误，现在已经修复了。但是存在语法错误。

Answer 1

您需要在请求成功时包含一个函数，其中包括响应。

$.ajax({
    type: "POST",
    url: "php/login.php",
    data: { email: "example@abc.com",password:"123" },
    success:function(data){
        alert(data)
    };
});

Answer 2

$.ajax({
    type: "POST",
    url: "php/login.php",
     data: { email: "example@abc.com",password:"123" },
    success: function (data) {
        alert(data);

    }
});

data来自AJAX来电的JSON格式为json decode。在您的PHP脚本中，您应该使用$data = file_get_contents("php://input"); $data = json_decode($data,true); $userEmail=$data['email']; $userPass=$data['password'];，如下所示

{{1}}

我希望这对你有所帮助。您的登录将按预期工作

Answer 3

尝试在我的机器上为我工作的代码。别忘了放置Jquery文件。 PHP（ajax.php）：

<html>
<head>
    <script src="jquery.min.js"></script>
    <script>
        function submitForLogin() 
 {
        alert("23");
        var email = document.getElementById("txtUserName").value;
        var password = document.getElementById("txtPassword").value;
    $.ajax({
            type: "POST",
            url: "login1.php",
            data: { email: email,password:password },
            success : function(response){
                alert(response);
            }
   });

 }

    </script>
</head>
<body>
    <input type="text" placeholder = "Enter user name" id="txtUserName"/>
    <input type="password" placeholder = "Enter password" id="txtPassword"/><br>
    <input type="button" onclick="submitForLogin();" value="Login"/>
</body>
</html>

服务器端（login1.php）：

    <?php
var_dump($_POST);
?>

Answer 4

更改您的php文件，如下所示：

<?php
$userEmail=$_POST['email'];
$userPass=$_POST['password'];
$servername ="localhost";
$username="root";
$password="";
$dbname="AS2014459";
//To create a connection

header('Content-type: application/json');


$con = mysqli_connect($servername,$username,$password,$dbname); //check connection
if(!$con){
    die("Connection failed: ".mysqli_connect_error());
}   
$sql="SELECT Email,Password FROM USERTABLE WHERE Email='".$userEmail."'";
$results=mysqli_query($con,$sql);
if(mysqli_num_rows($results)>0)
{
     $res = "userExist";
     $data = json_encode($res);
     echo $data;
     die();

}
else
{

    $res = "fakeUser";
    $data = json_encode($res);
    echo $data;
    die();
}
mysqli_close($con);



?>

你的剧本：

$.ajax({
type: "POST",
url: "php/login.php",
data: { email: "example@abc.com",password:"123" },
success:function(data){
    alert(data);
};
});

jQuery Ajax函数不起作用？

注意：example@abc.com和123存储在Wamp服务器数据库中的电子邮件和密码。

4 个答案: