Question

登录表单有问题。当我尝试登录时，即使我输入正确的用户名和密码，javascript也会返回false值。

这是我在jQuery文件中的代码：

$(document).ready(function(){

var teamname = $("#teamname");
var teampassword = $("#teampassword");

function isPasswordCorrect()
{
    var password = teampassword.val();
    var name = teamname.val();
    var result = false;

    $.post('../php/validations/validatePassword.php', {tname: name, tpassword: password}, function(data){
        if(data == 1){
            result = true;
        }else{
            result = false;
        }
    });
    return result;
}

$("#join").click(function(){
    if(isPasswordCorrect()){
        alert("You have joined");
    }else{
        alert("You have not joined");
    }
});
});

这是我在PHPfile中的代码：

<?php   
$teamname = $_POST['tname'];
$teampassword = $_POST['tpassword'];

if($teamname != "" || $teampassword !=""){
    include('../connection.php'); // Here is the log in to the phpmyadmin

    $queryCheckPassword = mysqli_query($con, "SELECT password FROM 
    teams WHERE    name = '$teamname'");

    $row = mysqli_fetch_row($queryCheckPassword);
    $teamPassword = $row[0];
    if($teamPassword == $teampassword)
    {
        echo 1;
    }else{
        echo 0;
    }
}
?>

这是我在HTML文件中的代码：

<form id="joinform">  <!-- action="teams.php" method="post"> -->
    <ul>
        <div>
            <label>Team name&nbsp<font color='red'>*</font></label>
            <input type='team' name='teamname' id='teamname' placeholder='Team name' readonly='readonly'/>
            <span id='teamnameinfo'>Select an existing team</span>
        </div>
        <div>
            <label for="teampassword">Team password&nbsp<font color='red'>*</font></label>
            <input type='password' name='teampassword' id="teampassword" placeholder='Team password'/>
            <span id='teampasswordinfo'>Write team password</span>
        </div>
        <div>
            <button name='join' id='join'>Join</button> 
        </div>
    </ul>
</form>

Answer 1

问题在于您使用Javascript。看看你的isPasswordCorrect函数（我稍微重新格式化了以使问题更清晰一点）：

function isPasswordCorrect()
{
    var password = teampassword.val();
    var name = teamname.val();
    var result = false;

    $.post(
        '../php/validations/validatePassword.php',
        {tname: name, tpassword: password},
        function (data) {
            if(data == 1){
                result = true;
            }else{
                result = false;
            }
        }
    );

    return result;
}

在那里看到function (data) {}？这是一个回调。 $.post方法的工作方式是：

您的JS代码使用$.post
你的JS代码继续，继续下一步
一段时间之后（可能是10毫秒之后，可能是30秒之后），服务器会响应请求。 此时您的回调称为。

这是什么意思？当您的代码到达return result;行时，您的代码刚刚将请求提交给服务器，服务器可能尚未响应。因此，result仍为false。

此问题的快速解决方案是将alert语句移动到回调中，如下所示：

function isPasswordCorrect()
{
    var password = teampassword.val();
    var name = teamname.val();

    $.post(
        '../php/validations/validatePassword.php',
        {tname: name, tpassword: password},
        function (data) {
            if(data == 1){
                alert("You have joined");
            }else{
                alert("You have not joined");
            }
        }
    );
}

$("#join").click(function(){ isPasswordCorrect(); });

然而，我想你不仅要做alert更多的事情。您需要研究Javascript的异步特性，并在扩展此片段之前了解它。

Answer 2

因为AJAX没有立即返回结果 - ASYNCHRONOUS - 你想在AJAX回调中仅检查并且仅在结果时进行检查：

function isPasswordCorrect()
{
    var password = teampassword.val();
    var name = teamname.val();
    $.post(
        '../php/validations/validatePassword.php', 
        { tname: name, tpassword: password }, 
        function(data) {
            if(data == 1) {
                alert("You have joined");
            } else {
                alert("You have not joined");
            } 
        }
    );
}

$("#join").click(isPasswordCorrect);

Answer 3

PeterKA关于异步是正确的。在您的异步调用返回之前，可能会返回默认值（false）。尝试添加回调（未经测试）：

function isPasswordCorrect(callback)
{
    var password = teampassword.val();
    var name = teamname.val();

    $.post('../php/validations/validatePassword.php', {tname: name, tpassword: password}, 
          function(data) { callback(data == 1); });
}

$("#join").click(function(){
    isPasswordCorrect(function(result) {
        if (result)
           alert("You have joined");
        else
           alert("You have not joined");
    });
});

检查密码是否正确jquery

3 个答案: