0

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

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";
}
4

1 回答 1

0

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

此外,您不需要那里的 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>
于 2013-01-10T18:22:32.203 回答