修改

Question

我将从我想要做的事开始。

我创建了一个“忘记密码”系统，用户输入他们的电子邮件地址，并且（如果正确）他们将收到一封带有重置链接的电子邮件。

表单页面中有一小部分ajax，用于检测输入的电子邮件是否在数据库中。如果数据库中存在电子邮件，则表单将颜色更改为绿色，并启用提交按钮。如果未检测到电子邮件，表单将保持红色并且提交按钮将被禁用。

enter image description here

问题在于，当键入电子邮件地址时，如果用户输入的字符多于正确的电子邮件，则可能会发生密钥更新事件（基本上，如果 hello@123.com 在我的数据库中，他们必须输入 hello@123.com1 才能提交启用）

Here is my JSFiddle除了ajax工作之外的一切。

以下是ajax文件本身的示例：

<?php

session_start();

$Email = $_POST['email'];

//Parse ini file containing database information
$databaseInfo = parse_ini_file("optiMizeWebReport.ini", true);

global $con;

//Connect to database
$con = @mysqli_connect($databaseInfo['optiMizeDatabaseConnection']    ['WebServer'],$databaseInfo['optiMizeDatabaseConnection']['Username'],     $databaseInfo['optiMizeDatabaseConnection']['Password'],     $databaseInfo['optiMizeDatabaseConnection']['DBName']);

//Check connection and output error if invalid
if(!$con)
{
    die('Connect Error ('. mysqli_connect_errno() .') '.mysqli_connect_error());
}

//Execute query
$result = mysqli_query($con, "SELECT COUNT(*) FROM login WHERE Email='$Email'")
or die("Error: ".mysqli_error($con));

//Initialize
$emailMatch = array();

//Extract
while($emailMatch[] = mysqli_fetch_array($result))


print_r($emailMatch[0][0]);

?>

如果有任何其他信息，我可以提供帮助，请告诉我。感谢。

修改

由于似乎还没有快速修复/回答，我制作了一段简短的视频，展示了究竟会发生什么。您可以在此处查看：https://www.youtube.com/watch?v=P-2Gz5b4ek8

Answer 1

Ajax请求是异步的！在您检查if(databaseCheck != 1)的情况下，databaseCheck的值是之前的ajax响应。这就是为什么你必须输入1个额外的字符来获得最后的结果。

$('input').bind("keyup", function() {
    $.ajax({
           type: "POST",
           url: "ForgotPasswordAjax.php",
           data: {email: $('#email').val()},
           success: function(output){
               console.log(output);
               notification(output);
           }
    });
});
function notification(databaseCheck) {
    if (databaseCheck != 1) {
        ....
    } else {
        ....
    }
}

成功部分调用这样的函数，它将确保这些代码在ajax成功后运行。它将解决您当前的问题，但您必须防止同时进行ajax调用。我们不知道哪个请求首先返回，如果第一个请求响应最后js将使用该响应设置通知。所以你必须添加一个处理标志来阻止它。

Answer 2

我更新了JsFiddle。

这里我已将keydown和焦点纳入

$('#email').bind("keyup keydown change focus blur", function() {

并在行下方更改

 $('input').bind("keydown", function() {

Answer 3

jQuery还有另一个名为input的事件。

$('#email').bind("input", function() {

updated jsFiddle

jQuery：keyup事件 - ajax返回验证

修改

3 个答案: