首页 > 解决方案 > 使用 AJAX 实时搜索抓取内部网页

问题描述

我正在为我的搜索框使用 W3S 的 Ajax 实时搜索教程代码。我在 xml 文件中设置了几个链接,因为这个搜索框应该用于连接相关的内部页面。它工作正常,但问题是搜索结果显示在另一个神秘页面中,我必须单击它才能链接我想去的页面,这不是我所期望的。

这是我第一次尝试 php、Ajax、xml 等。我搜索了类似的问题和答案,但没有找到。

------这是livesearch.php的代码,和W3S基本一样---

<?php
$xmlDoc=new DOMDocument();
$xmlDoc->load("links.xml");

$x=$xmlDoc->getElementsByTagName('link');


$q=$_GET["s"];


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)
{
if (stristr($y->item(0)->childNodes->item(0)->nodeValue,$q))
{
if ($hint=="")
{
$hint="<a href='" . 
$z->item(0)->childNodes->item(0)->nodeValue . 
"' target='_blank'>" . 
$y->item(0)->childNodes->item(0)->nodeValue . "</a>";
}
else
{
$hint=$hint . "<br /><a href='" . 
$z->item(0)->childNodes->item(0)->nodeValue . 
"' target='_blank'>" . 
$y->item(0)->childNodes->item(0)->nodeValue . "</a>";
}
}
}
}
}


if ($hint=="")
{
$response="no suggestion";
}
else
{
$response=$hint;
}



echo $response;
?> 

--------脚本代码在我的 index.html 页面上--------

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

</body>
</html> 

----- 这是我用于 XML 的代码 -----

<pages>
<link>
<title>Name 1</title>
<url>http://www.xxxx1.html</url>
</link>
<link>
<title> Name 2</title>
<url>http://www.xxxx2.html</url>
</link>
<link>
<title>Name 3</title>
<url>
http://www.xxxx3.html
</url>
</link>
</pages>

----- 这是我用于搜索框的代码 -----

                  <input id="livesearch" autocomplete="on" ibMouseDown="" onBlur="" autopcapitalize="none" autofocus name="s" value="" placeholder="Search for wines or winerary" required="required" type="search" onkeyup="showResult(this.value)">
                     <button class="rd__button" data-trach-action="hero" hata-track-label="searchicon" id="search-action" title="Search">
                       <i class="search-icon rd__svg-icon rd__svg-icon--textsecondary rd__svg-icon--large">
                       </i>
                     </button>
                </div>
               </form>

----- 我还在 index.html 中添加了自动完成功能 ------

<script>
    var name = ["", "", ""];

   $('#livesearch').autocomplete({
     source: name
   },{});

   </script>

我想我现在遇到的问题,可能是部分代码没有写,这就是为什么网页没有直接显示,只是我不知道我该怎么做。如果您知道什么,请告诉我,欢迎任何建议。

标签: phpajaxxmllivesearch

解决方案


推荐阅读