Javascript 希望在用户检查用户名可用性时将ajax_loder.gif保留一到两秒以显示_Javascript_Php_Mysql_Ajax

Javascript 希望在用户检查用户名可用性时将ajax_loder.gif保留一到两秒以显示

javascript php mysql ajax

Javascript 希望在用户检查用户名可用性时将ajax_loder.gif保留一到两秒以显示,javascript,php,mysql,ajax,Javascript,Php,Mysql,Ajax,问题是gif并没有显示所需的时间，而是显示了毫秒并消失了，所以无法看到gif 我应该将setTimeout代码或任何相关代码放在哪里，以使动画gif显示1到2秒。我无法理解这一点 <?php if(isset($_POST["name2check"]) && $_POST["name2check"] != ""){ include('connection.php'); $username = preg_replace('#[^a-z0-9]#i', '', $_POST['

问题是gif并没有显示所需的时间，而是显示了毫秒并消失了，所以无法看到gif 我应该将setTimeout代码或任何相关代码放在哪里，以使动画gif显示1到2秒。我无法理解这一点

<?php
if(isset($_POST["name2check"]) && $_POST["name2check"] != ""){
include('connection.php');
$username = preg_replace('#[^a-z0-9]#i', '', $_POST['name2check']); 
$username = $_POST['name2check']; 
//echo "name $username";
$sql_uname_check = mysqli_query($conn,"SELECT id FROM admin WHERE username='$username' LIMIT 1"); 
$uname_check =  mysqli_num_rows($sql_uname_check);
if (strlen($username) < 4) {
    echo '4 - 15 characters please';
    exit();
}
if (is_numeric($username[0])) {
    echo "<font color='#FF0000'>First character must be a letter</font>";
    exit();
}
if ($uname_check < 1) {
    echo '<strong>' . $username . '</strong> is '."<font color='#FF0000'   >OK</font><img src='checked.gif' alt='Mountain View'  style='width:50px;height:50px;'>";
    exit();
} else {
    echo '<strong>' . $username . '</strong> is'. "<font color='#FF0000'  >TAKEN</font>";
    exit();
}
}
?>
<html>
<head>
<script src="ajax_module.js"></script>
<script src="main.js"></script>

<script>
function checkusername()
{
var u = _("uname").value;
if(u != "")
{
    _("usernamestatus").innerHTML = '<img src="ajax-loader.gif" width="31"  height="31">';
    //_("usernamestatus").innerHTML = '<img src="checked.gif" alt="Mountain   View" style="width:50px;height:50px;">';
    var ajax = ajaxObj("POST", "test.php");
    ajax.onreadystatechange = function() 
    {
        if(ajaxReturn(ajax) == true) 
        {
            _("usernamestatus").innerHTML = ajax.responseText;
        }
    }
    ajax.send("name2check="+u);
}
}
</script>
</head>
<body>
<input type="text" name="uname" id="uname" oninput="checkusername()"     maxlength="15">
<span id="usernamestatus"></span>
</body>
</html>

如果您总是希望它显示2秒钟，那么下面的更改应该有效。唯一的问题是，如果ajax响应本身需要3秒钟，那么用户现在将等待5秒钟

if(ajaxReturn(ajax) == true) 
{
                setTimeout(function () {_("usernamestatus").innerHTML = ajax.responseText}, 2000);
}

在设置超时之前，您可以随时检查是否已过2秒

function checkusername()
{
    var delay = 2000;
    var start = new Date();
    var u = _("uname").value;
    if(u != "")
    {
        _("usernamestatus").innerHTML = '<img src="ajax-loader.gif" width="31"  height="31">';
        //_("usernamestatus").innerHTML = '<img src="checked.gif" alt="Mountain   View" style="width:50px;height:50px;">';
        var ajax = ajaxObj("POST", "test.php");
        ajax.onreadystatechange = function() 
        {
            if(ajaxReturn(ajax) == true) 
            {
                var diff = Math.abs(start - new Date());
                if (diff < 2000)
                {   
                    delay = (delay - diff);
                }
                else
                {   
                    delay = 0;
                }
                setTimeout(function () {_("usernamestatus").innerHTML = ajax.responseText}, delay);
            }
        }
        ajax.send("name2check="+u);
    }
}

谢谢你按照我的要求工作：尝试了两种代码，喜欢第一种，再次感谢