0

我正在尝试使用 Ajax (Javascript + php) 检查当用户将焦点更改为表单的另一个字段时用户名是否可用。我的函数只有在我有一些 alert() 时才起作用,如果我删除它们,这些函数就会停止工作。

另一个奇怪的是,alert(requestObject.readyState);它只显示状态 1。据我了解,它应该显示所有状态,或者至少也显示状态 4。

这是我的 javascript 代码,它位于 HTML 页面的标题中。

    var requestObject = false;
    function funcReceiveData()
    {
        alert(requestObject.readyState);
        if(requestObject.readyState == 4)
        {
            if(requestObject.status == 200)
            {
                var status = requestObject.responseText;
                if(status == "ok")
                {
                    document.getElementById('userValid').innerHTML = 'Valid user';
                }
                else
                {
                    document.getElementById('userValid').innerHTML = 'Choose another username';
                }
            }
        }
    }

if (window.XMLHttpRequest)
{
    requestObject = new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
    requestObject = new ActiveXObject("Microsoft.XMLHTTP");
}

function checkUser()
{
    if(requestObject){
        requestObject.open("POST", "addUser.php", true);
        requestObject.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        var user = document.getElementById('username').value;
        var tobesent = "username=" + user;
        requestObject.send(tobesent);
        requestObject.onreadystatechange = funcReceiveData();
        alert(tobesent);
    }
}

这是我的 HTML 代码的正文部分:

<BODY>
<form method="POST" action="addUser.php">
    <table>

        <tr>
            <td><strong>Username:</strong></td>
            <td><input type="text" name="username" size="25" onblur="checkUser();" id="username"></td>
            <td><i id='userValid'>bla</i>
        </tr>

        <tr valign="top">
            <td><strong>Password:</strong></td>
            <td><input type="password" name="password" size="25"></td>
        </tr>

        <tr valign="top">
            <td><strong>Frist name:</strong></td>
            <td><input type="text" name="Fname" size="25"></td>
        </tr>

        <tr valign="top">
            <td><strong>Last name:</strong></td>
            <td><input type="text" name="Lname" size="25"></td>
        </tr>

        <tr valign="top">
            <td><strong>Address line 1:</strong></td>
            <td><input type="text" name="address1" size="50"></td>
        </tr>

        <tr valign="top">
            <td><strong>Address line 2:</strong></td>
            <td><input type="text" name="address2" size="50"></td>
        </tr>

        <tr valign="top">
            <td><strong>City:</strong></td>
            <td><input type="text" name="city" size="25"></td>
        </tr>

        <tr valign="top">
            <td><strong>Postcode:</strong></td>
            <td><input type="text" name="postcode" size="25"></td>
        </tr>

        <tr valign="top">
            <td><strong>Phone:</strong></td>
            <td><input type="text" name="phone" size="25"></td>
        </tr>

        <tr valign="top">
            <td><strong>Mobile:</strong></td>
            <td><input type="text" name="mobile" size="25"></td>
        </tr>

        <tr valign="top">
            <td><strong>Email:</strong></td>
            <td><input type="text" name="email" size="25"></td>
        </tr>
        <tr>
            <td><input type="submit" value="Submit" /></td>
            <td><input type="reset" value="Clear" /></td>
        </tr>
    </table>
</form>

我的 PHP 代码如下,这是一个非常愚蠢的代码,只是为了测试。之后我将检查数据库中的用户名。

<?php 
$user = $_POST['username'];
if($user == "Tiago")
    echo("ok");
else
    echo("Error");
?>

我的页面托管在这个地址:https ://devweb2012.cis.strath.ac.uk/~ntb13105/WAD/tests/Twig/FINAL/addUser.html

有没有人知道发生了什么?

4

1 回答 1

2

您正在调用 funcReceiveData而不是将其用作readyStateChange事件处理程序。

它不起作用,因为此时 HTTP 请求还没有响应。在其中粘贴警报会延迟读取值的尝试,requestObject.readyState直到您单击“确定”,这对于响应到达而言足够长。

在发送请求之前删除()并分配事件处理程序。

requestObject.onreadystatechange = funcReceiveData;
requestObject.send(tobesent);
于 2013-04-17T09:19:49.043 回答