PHP AJAX实时搜索-放置GIF加载程序图标

时间:2018-11-02 18:52:34

标签: php ajax

当前我正在使用此脚本进行实时搜索

https://www.w3schools.com/php/php_ajax_livesearch.asp

但是问题是我希望当用户键入某些内容时将gif图像加载到搜索框的正确位置,并在结果显示时将其隐藏。

谢谢

1 个答案:

答案 0 :(得分:0)

您需要在showResult函数中添加逻辑:

<script>
function showResult(str) {
  if (str.length==0) { 
    document.getElementById("livesearch").innerHTML="";
    document.getElementById("livesearch").style.border="0px";
    return;
  }
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {  // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
    if (this.readyState==4 && this.status==200) {
      document.getElementById("livesearch").innerHTML=this.responseText;
      document.getElementById("livesearch").style.border="1px solid #A5ACB2";
    }
    /// HERE hide the image ----------------------------
  }
  xmlhttp.open("GET","livesearch.php?q="+str,true);
  xmlhttp.send();
  /// HERE show the image ---------------------------
}
</script>

您知道创建IMG元素并将其附加到输入框旁边的代码吗?