javascript - 类似 Google 自动建议脚本中的 xmlHttpRequest 问题

Question

我正在尝试建立一个类似于 Google Suggestion(或 Autosuggestion？)的自动建议搜索字段。

我使用纯javaScript/AJAX和2个文件:index.php和ajax-submit.php(是我实际查询数据库的文件)。但目前我只是回显文本以进行调试。

有几个问题:

问题 1: 问题是 firebug 输出:当我在搜索输入中键入某些内容时，xmlhttp 并未定义 [已解决，请参见下文]。

问题2:我还想回显搜索输入的内容，如下所示:

echo $_GET['search_text']; 

或

if(isset($_GET['search_text'])) {
    echo $search_text = $_GET['search_text'];
}

但我收到以下错误:* undefined index :ajax-submit.php中的search_text*

这是我的函数建议调用:

<form action="" name="search" id="search">
        <input type="text" name="search_text" id="search_text" onkeydown="suggest();" />
</form>
<div id="results" style="background:yellow"></div>

这是我的函数 suggest():

<script type="text/javascript">
    //function does not needs params because is unique to the input search_text
    function suggest() {
    //browser object check
    if(window.xmlHttpRequest) {
    xmlhttp = new xmlHttpRequest();
    }
    else if (window.ActiveXObject) {
    //console.log("error");
    xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
    }
    //when the onreadystatechange event occurs
    xmlhttp.onreadystatechange = function() {

        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

        document.getElementByID('results').innerHTML = xmlhttp.responseText;
        }

    }//end onready

    xmlhttp.open('GET', 'ajax-submit.php', true);
    xmlhttp.send();

    }//end suggest

</script>

这是我的 php ajax-submit 文件:

<?php
echo 'Something';
?>

有人可以帮我调试吗？这可能是一个范围问题，但我不知道。

第二个问题是您通常如何在 Firebug 中调试 Ajax 请求？

谢谢

Answer 1

其实是这样的

XMLHttpRequest()

不是

xmlHttpRequest()

<小时/>

要创建真正的跨浏览器兼容的 XHR 对象，请执行以下操作:

var _msxml_progid = [
    'Microsoft.XMLHTTP', 
    'MSXML2.XMLHTTP.3.0',
    'MSXML3.XMLHTTP',
    'MSXML2.XMLHTTP.6.0'
];

var xhr = ( function() {
    var req;
    try {
        req = new XMLHttpRequest();
    } catch( e ) {
        var len = _msxml_progid.length;
        while( len-- ) {
            try {
                req = new ActiveXObject(_msxml_progid[len]);
                break;
            } catch(e2) { }
        }
    } finally {
        return req;
    }
}());