Question

我有以下代码在我的网站上实现一个非常基本的登录系统（使用jQuery Mobile）。问题是，当通过jQuery Mobile提交表单（因此使用验证程序）时，验证程序始终返回false并抛出错误，即使密码正确也是如此。当我编写一个单独的表单，除了两个文本框和一个提交按钮之外，并将其直接运行到验证脚本，它根据给定的密码返回正确的值true或false。 jQuery脚本有什么问题导致它总是返回false？

HTML / JS：

<form action="logins.php" method="POST" id="loginForm" name="loginForm" data-ajax="false">
<label for="email" class="ui-hidden-accessible">Email Address:</label>
<input type="text" id="email" name="email" value="" placeholder="Email Address" />
<label for="pass" class="ui-hidden-accessible">Password:</label>
<input type="password" id="pass" name="pass" value="" placeholder="Password" />
<input class="submit" data-role="submit" type="submit" value="Submit" />
</form><br>
<br>
<a href="#index" data-role="button" data-transition="slide" data-direction="reverse">Return to home page</a>
<script>
    $('#login').bind('pageinit', function(event) {
        $('#loginForm').validate({
            onkeyup: false,
            onclick: false,
            onfocusout: false,
            rules: {
                email: {
                    required: true,
                    email: true
                },
                pass: {
                    required: true,
                    remote: {
                        url: "passcheck.php",
                        type: "post"
                    }
                }
            },
            messages: {
                email: {
                    required: "You must enter an email address.",
                    email: "You must enter a valid email address."
                },
                pass: {
                    required: "You must enter a password.",
                    remote: "Your username/password combination is incorrect."
                }
            }
        });
    });
</script>

PHP（passcheck.php）：

<?php
    require("common.php");

$query = "SELECT password FROM users WHERE email = :email";
$query_params = array(':email' => $_POST['email']);

try { 
    $stmt = $conn->prepare($query); 
    $stmt->execute($query_params);
} catch(PDOException $ex) { 
    die("Failed to run query."); 
}

$hash = $stmt->fetchColumn();

if(crypt($_POST['pass'], $hash) === $hash){
    echo "true";
} else {
    echo "false";
}

Answer 1

您应该使用submitHandler编写一个函数来使用AJAX Form http://www.malsup.com/jquery/form/#api通过AJAX处理用户名/密码的实际检查。您不必使用AJAX Form，并且可以使用jQuery ajax（）方法编写自己的方法来处理登录检查，但是AJAX Form已经预先为您编写了。

此外，您不需要onkeyup，onblur等 - 只需将onsubmit设置为true即可。您的代码应如下所示：

<script>
    $('#login').bind('pageinit', function(event) {
        $('#loginForm').ajaxForm(); // Set as an AJAX Form - See Documentation Above
        $('#loginForm').validate({
            onsubmit: true,
            rules: {
                email: {
                    required: true,
                    email: true
                },
                pass: {
                    required: true
                }
            },
            messages: {
                email: {
                    required: "You must enter an email address.",
                    email: "You must enter a valid email address."
                },
                pass: {
                    required: "You must enter a password.",
                }
            },
            submitHandler: function(form) {
                $("#loginForm").ajaxSubmit();
            }
        });
    });
</script>

jQuery远程验证总是返回false

1 个答案: