php - Ajax 检查表单上的注册电子邮件

Question

我使用此脚本来检查电子邮件是否使用ajax在数据库中注册。问题是: 它只是检查一次，如果用户插入注册电子邮件然后插入另一封电子邮件，则 checkemail.php 中的 var 不会更改。

<script type="text/javascript">
    $(document).ready(function() {
        var x_timer;    
        $("#email").keyup(function (e){
            clearTimeout(x_timer);
            var email = $(this).val();
            x_timer = setTimeout(function(){
                check_username_ajax(email);
            }, 600);
        }); 

        function check_username_ajax(email){
            $.post('checkemail.php', {'email':email}, function(data) {
                $("#user-result").html(data);
            });
        }
    });
</script>
<input type="email" name="email" id="email" placeholder="E-mail" /><span id="user-result"></span>

检查电子邮件.php

<?php
    require'conexao.php';
    $email = mysql_real_escape_string($_POST['email']);
    $SQL = "SELECT email FROM clients WHERE email = '" . $email . "'";
    $check = @mysql_query($SQL) or die("Erro no banco de dados!");
    $result = @mysql_num_rows($check);

    if($result){
        $emailstate = "1";
        echo '<script type="text/javascript">alert("O E-mail informado já está cadastrado.");</script>
        <input type="radio" id="emailstate" name="emailstate" value="<?php echo $emailstate; ?>" style="display:none;" checked>';
    } else {
        $emailstate = "0";
        echo '<input type="radio" id="emailstate" name="emailstate" value="<?php echo $emailstate; ?>" style="display:none;" checked>';
    }
?>

有人可以帮我吗？

Answer 1

您的问题显示的代码没有多大意义，即不清楚您到底想要实现什么目标，但这将使您走上正确的轨道。

检查电子邮件.php

<?php
if (!empty($_POST['email'])) {
    // Lookup
    $email = $_POST['email'];
    $sql = "SELECT email, username FROM clients WHERE email = '" . mysql_real_escape_string($email) . "' LIMIT 1";
    $result = mysql_query($sql);
    // Format the response package and send back to calling .js function
    $response = new stdClass();
    if (!$result) {
        $response->error = "Could not successfully run query ($sql) from DB: " . mysql_error();
        exit;
    } else {
        $row = mysql_fetch_assoc($result);
        if ($response->exists = mysql_num_rows($result)) {
            // If account exists, get username and add to response data
            $response->username = $row['username'];
        }
    }
    echo json_encode($response);
    exit;
}
?>

客户端 html/js:

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#email").blur(function (e) {
            var email = $(this).val();
            check_username_ajax(email);
        });

        function check_username_ajax(email) {
            $.post('checkemail.php', {'email': email}, function (data) {
                //uncomment the line below to inspect the response in js console/firebug etc
                //console.log(data);
                if (data.hasOwnProperty('error')) {
                    $("#user-result").html(data.error);
                } else {
                    if (data.exists == '1') {
                        $("#user-result").html('Account exists, username is: ' + data.username);
                    } else {
                        $("#user-result").html('Account does not exist');
                    }
                }
            }, "json");
        }
    });
</script>
<div>
    <input type="email" name="email" id="email" placeholder="E-mail" />
    <span id="user-result"></span>
</div>

您可以向 PHP 响应对象添加其他属性，如下所示:$response->username，然后访问 js ajax/post 响应中的变量，如下所示:data.username.

正如其他评论者所说，用任意延迟松开“setTimeout”，它在这里并不适用，也许您会发现 onBlur 更合适，如图所示，或者可能包装成完整的形式 - 就目前情况而言，尚不清楚您的预期用途是什么。