AJAX代码发送GET请求两次

我的TA说通过跟随AJAX代码发送GET请求两次。但我看不到我能修复它。什么是一般方法如何处理？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); 
}

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 
} 
?>

来源

2014-01-19 alop789312

用于检查，使用Firebug或Chrome的Js控制台，在函数的定义中设置一个破裂点，并且您将看到何时发送它 – Chococroc

_“问题必须在getByPrefix函数的某处。”_ - 否它没有。它看起来像'getByPrefix（）'会做一个ajax调用。但是，您在响应每个键盘事件时调用它，因此用户键入'getByPrefix（）'将被重复调用。（另外，测试点if（window.XMLHttpRequest）'如果没有其他的情况下，如果该对象不存在吗？） – nnnnnn

是的，你可以键入一个字母，但如果它是大写的，你需要按住shift键，在释放后''keyup'会被触发两次。 – Karol

你可能输入大写字母，与SHIFT关键，所以一旦你松开按键被触发两次keyup事件你有2 AJAX请求。

您可以使用eventData param过滤按下的按键。对于SHIFT键看here。

来源

2014-01-20 00:07:12 Karol

那么，但如何过滤如果键入只是字符？ – alop789312

@jb91看编辑，并提出后续问题。 – Karol

AJAX代码发送GET请求两次

回答

相关问题