PHP 实例 AJAX 实时搜索

在使用 PHP 的时候，可以通过 AJAX 为用户提供更友好、交互性更强的搜索体验。本节给出了具体介绍！

AJAX Live Search

在下面的实例中php实例，我们将演示一个实时的搜索，在您键入数据的同时即可得到搜索结果。

实时的搜索与传统的搜索相比，具有很多优势：

在下面的文本框中搜索 W3CSchool 的页面

上面实例中的结果在一个 XML 文件（links.xml）中进行查找。为了让这个例子小而简单，我们只提供 6 个结果。

实例解释 - HTML 页面

当用户在上面的输入框中键入字符时，会执行 "showResult()" 函数。该函数由 "onkeyup" 事件触发：

源代码解释：

如果输入框是空的（str.length==0），该函数会清空 livesearch 占位符的内容，并退出该函数。

如果输入框不是空的，那么 showResult() 会执行以下步骤：

PHP 文件

上面这段通过 JavaScript 调用的服务器页面是名为 "livesearch.php" 的 PHP 文件。

"livesearch.php" 中的源代码会搜索 XML 文件中匹配搜索字符串的标题，并返回结果：

<?php
 $xmlDoc=new DOMDocument();
 $xmlDoc->load("links.xml");
 $x=$xmlDoc->getElementsByTagName('link');
 //get the q parameter from URL
 $q=$_GET["q"];
 //lookup all links from the xml file if length of q>0
 if (strlen($q)>0)
 {
 $hint="";
 for($i=0; $i<($x->length); $i++)
 {
 $y=$x->item($i)->getElementsByTagName('title');
 $z=$x->item($i)->getElementsByTagName('url');
 if ($y->item(0)->nodeType==1)
 {

 //find a link matching the search text
 if (stristr($y->item(0)->childNodes->item(0)->nodeValue,$q))
 {
 if ($hint=="")
 {
 $hint="" . 
 $y->item(0)->childNodes->item(0)->nodeValue . "";
 }
 else
 {
 $hint=$hint . "
" . 
 $y->item(0)->childNodes->item(0)->nodeValue . "";
 }
 }
 }
 }
 }
 // Set output to "no suggestion" if no hint were found
 // or to the correct values
 if ($hint=="")
 {
 $response="no suggestion";
 }
 else
 {
 $response=$hint;
 }
 //output the response
 echo $response;
 ?> 

如果 JavaScript 发送了任何文本（即 strlen($q) > 0），则会发生：

（编辑：92站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!