如何使用AJAX进行搜索

How to perform search using AJAX?

本文关键字：搜索 AJAX 何使用      更新时间：2023-09-26

我有以下HTML代码：

<table style="border: 1px solid #9f9f9f; float:right;">
                <tr>
                <td><label for="status">Search Status</td>
                <td><input type="text" id="status" name="status" dojoType="dijit.form.TextBox" size="40" value="Please enter search criteria"/></td>
                </tr>
                <tr>
                <td><label for="push">Push to start</td>
                <td><button dojoType="dijit.form.Button"  style="width: 4em" type="button" name="submitButton" value="Submit" onclick="loadContents()"></button></td>
                </tr></table>

我希望当用户在文本框中输入一些关键字并点击按钮时，会有一个Ajax调用来从本地的一个简单的txt文件中检索搜索结果。请指导我如何做到这一点？我已经编写了loadContents方法，它只是检索txt文件的内容，但我希望它基于搜索。装载的示例代码内容：

<script type="text/javascript"> function loadContents() {var xmlhttp;
if (window.XMLHttpRequest)
  {xmlhttp=new XMLHttpRequest();
  }
else
  { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","content.txt",true);
xmlhttp.send();
}
</script>

听起来像JQuery的ajax方法和JQuery UI自动完成功能对你来说是一件好事——没有必要重新发明轮子。（你会发现它可以在更多的浏览器中使用！！）

与其直接向文本文件发出ajax请求，不如将其发送到服务器端页面（您没有提到您使用的服务器端技术是什么？）-该页面应该接受一个用于搜索文本文件的查询字符串参数，并且只向客户端返回匹配的结果。

相关文章：