Javascript AJAX代码发送GET请求两次_Javascript_Php_Ajax

Javascript AJAX代码发送GET请求两次

javascript php ajax

Javascript AJAX代码发送GET请求两次,javascript,php,ajax,Javascript,Php,Ajax,我的TA说，按照AJAX代码执行GET请求将被发送两次。但我不知道如何也无法修复它。一般方法是什么？如何处理这是一个简单的页面，带有搜索框，在您键入时提供建议。问题必须在getByPrefix函数中的某个地方 JS代码： function set(arg) { var searchtext = document.getElementById("searchtext"); searchtext.value = arg.innerHTML; showMatches(sear

我的TA说，按照AJAX代码执行GET请求将被发送两次。但我不知道如何也无法修复它。一般方法是什么？如何处理

这是一个简单的页面，带有搜索框，在您键入时提供建议。问题必须在getByPrefix函数中的某个地方

JS代码：

function set(arg)
{
    var searchtext = document.getElementById("searchtext");
    searchtext.value = arg.innerHTML;
    showMatches(searchtext);
}

function getByPrefix(prefix, callback)
{
    var prefixes = [];

    if (window.XMLHttpRequest)
        xmlhttp = new XMLHttpRequest();

    xmlhttp.onreadystatechange = function()
    {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
        {
            var response = JSON.parse(xmlhttp.responseText);

            for (var i = 0; i < response.length; i++) // prepsani do jednoducheho indexovaneho pole
            {
                prefixes.push(response[i].drug);
            }

            callback(prefixes);         
        }
    }

    xmlhttp.open("GET","prefixes.php?q="+prefix,true);
    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=utf-8');
    xmlhttp.setRequestHeader('Cache-Control', 'no-cache');
    xmlhttp.send();
}

function action2(text)
{
    getByPrefix(text.value, showMatches);
}

function showMatches(text)
{
    var matches = text;

    var form = document.getElementById("search");
    var results = document.getElementById("results");

    if (results != null)
        form.removeChild(results);

    var div = document.createElement("div");
    div.id = "results";

    for (var i =0; i < matches.length; i++)
    {
        var p = document.createElement("p");
        p.className = "hidden";
        p.onclick =  (function(a) { return function(){ set(a); }})(p);
        p.innerHTML = matches[i];

        div.appendChild(p);
    }

    if (matches.length>1 && text.value != "")
        form.appendChild(div);

    if (matches.length==1 && text.value != matches[0])
        form.appendChild(div);
}

函数集（arg）
{
var searchtext=document.getElementById（“searchtext”）；
searchtext.value=arg.innerHTML；
显示匹配（搜索文本）；
}
函数getByPrefix（前缀，回调）
{
var前缀=[]；
if（window.XMLHttpRequest）
xmlhttp=新的XMLHttpRequest（）；
xmlhttp.onreadystatechange=函数（）
{
if（xmlhttp.readyState==4&&xmlhttp.status==200）
{
var response=JSON.parse（xmlhttp.responseText）；
对于（var i=0；i1&&text.value！=“”）
表格.附属儿童(div);；
if（matches.length==1&&text.value！=匹配[0]）
表格.附属儿童(div);；
}

PHP代码：

<?php
function head()
{
    global $db;
?>
<head>
    <title>Search</title>
    <?php head_common(); ?>
    <script type="text/javascript" src="js/main.js"></script>
</head>
<?php
}

function body()
{
?>
<body>
    <?php heading(); ?>
   <div>
    <img src="img/logo.jpg" height="200" width="400"> 
    <form id="search" method="get" action="index.php">
        <p>
            <input name="page" value="results" type="hidden">
            <input name="part" value="1" type="hidden">
            <input name="hledej" id="searchtext" autocomplete="off" onKeyUp="action2(this)" type="text">
            <button>Hledej</button>
        </p>
    </form>
    </div>
    <?php footer(); ?>
</body>
<?php
}
?>


搜寻

赫莱德

您可能正在使用

SHIFT

键键入大写字母，因此一旦释放键，

keyup

事件将触发两次，您有两个

AJAX

请求

您可以使用

eventData

param过滤按键。对于

SHIFT

键外观。

对于检查，请使用Firebug或Chrome的Js控制台，在函数定义中设置一个断点，您将看到何时发送它“问题必须在getByPrefix函数中的某个地方。”-不，不是。在我看来，

getByPrefix（）

将进行一次ajax调用。但是您调用它是为了响应每个keyup事件，因此用户类型

getByPrefix（）

将被重复调用。（顺便说一句，如果该对象不存在，那么测试

if（window.XMLHttpRequest）

还有什么意义？）是的，您可以键入一个字母，但如果是大写字母，则需要按住shift键，并且在释放它之后

keyup

会触发两次。是的！这就是问题所在@Carlos把它写下来作为一个答案，这样我就可以接受了。好吧，但是如果keyup是char only，如何过滤？@jb91查看编辑，并建议后续问题。