Home  >  Article  >  Backend Development  >  各位你们好,php+ajax搜索文本框下方提示功能

各位你们好,php+ajax搜索文本框下方提示功能

WBOY
WBOYOriginal
2016-06-13 11:52:581013browse

各位大虾你们好,php+ajax搜索文本框下方提示功能!
各位大侠在吗?我想实现这个功能,目前文本框输入字母可以ajax显示对应的值了,但是不是我想要的,我想要的是直接在文本框下方提示,类似于百度搜索提示那种效果!!!能帮忙改下吗,本人菜鸟,想了解这功能流程,忘各位大虾赐教!!!跪拜!!!


目前的效果:



想要的效果:


html代码:

<br /><html><br /><head><br /><script src="clienthint.js"></script> <br /><link rel="stylesheet" type="text/css" href="css/jquery.suggest.css"><br /><style type="text/css"> <br />div { <br />position:absolute; <br />top:45%; <br />left:50%; <br />margin:-100px 0 0 -200px; <br />width:400px; <br />height:200px; <br />line-height:200px; <br />font-size:16px; <br />z-index:99;<br />} <br /><br /></style> <br /></head><br /><br /><body><br /><br /><div><br /><form action="gethint.php" method="get" name="q"> <br /><input type="text" id="q" name="q" onkeyup="showHint(this.value)"   style="max-width:90%" /><br /><input type="submit" style="width:80px; height:34px;" value="Search"/> <br /></form><br /><br /><p style="margin-top:-160px; width:600px;">Suggestions: <span id="txtHint"></span></p><br /><br /></div><br /><br /></body><br /></html><br />


php代码:
<br /><?php<br />// Fill up array with names<br />$a[]="Anna1";<br />$a[]="Anna2";<br />$a[]="Anna3";<br />$a[]="Anna4";<br />$a[]="Anna5";<br />$a[]="Anna6";<br /><br />$a[]="Brittany1";<br />$a[]="Brittany2";<br />$a[]="Brittany3";<br />$a[]="Brittany4";<br />$a[]="Brittany5";<br />$a[]="Brittany6";<br />$a[]="Brittany7";<br /><br />$a[]="Cinderella1";<br />$a[]="Cinderella2";<br />$a[]="Cinderella3";<br />$a[]="Cinderella4";<br />$a[]="Cinderella5";<br />$a[]="Cinderella6";<br />$a[]="Cinderella7";<br /><br />$a[]="Diana1";<br />$a[]="Diana2";<br />$a[]="Diana3";<br />$a[]="Diana4";<br />$a[]="Diana5";<br />$a[]="Diana6";<br />$a[]="Diana7";<br /><br />$a[]="Eva";<br />$a[]="Fiona";<br />$a[]="Gunda";<br />$a[]="Hege";<br />$a[]="Inga";<br />$a[]="Johanna";<br />$a[]="Kitty";<br />$a[]="Linda";<br />$a[]="Nina";<br />$a[]="Ophelia";<br />$a[]="Petunia";<br />$a[]="Amanda";<br />$a[]="Raquel";<br />$a[]="Cindy";<br />$a[]="Doris";<br />$a[]="Eve";<br />$a[]="Evita";<br />$a[]="Sunniva";<br />$a[]="Tove";<br />$a[]="Unni";<br />$a[]="Violet";<br />$a[]="Liza";<br />$a[]="Elizabeth";<br />$a[]="Ellen";<br />$a[]="Wenche";<br />$a[]="Vicky";<br /><br />//get the q parameter from URL<br />$q=$_GET["q"];<br /><br />//lookup all hints from array if length of q>0<br />if (strlen($q) > 0)<br />{<br />$hint="";<br />for($i=0; $i<count($a); $i++)<br />  {<br />  if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))<br />    {<br />    if ($hint=="")<br />      {<br />      $hint=$a[$i];<br />      }<br />    else<br />      {<br />      $hint=$hint." , ".$a[$i];<br />      }<br />    }<br />  }<br />}<br /><br />//Set output to "no suggestion" if no hint were found<br />//or to the correct values<br />if ($hint == "")<br />{<br />$response="no suggestion";<br />}<br />else<br />{<br />$response=$hint;<br />}<br /><br />//output the response<br />echo $response;<br />?><br />

------解决方案--------------------
示例

<?php <br />if($_SERVER['REQUEST_METHOD'] == "POST") {<br>  $a[]="Anna1";<br>  $a[]="Anna2";<br>  $a[]="Anna3";<br>  $a[]="Anna4";<br>  $a[]="Anna5";<br>  $a[]="Anna6";<br> <br>  $a[]="Brittany1";<br>  $a[]="Brittany2";<br>  $a[]="Brittany3";<br>  $a[]="Brittany4";<br>  $a[]="Brittany5";<br>  $a[]="Brittany6";<br>  $a[]="Brittany7";<br> <br>  $a[]="Cinderella1";<br>  $a[]="Cinderella2";<br>  $a[]="Cinderella3";<br>  $a[]="Cinderella4";<br>  $a[]="Cinderella5";<br>  $a[]="Cinderella6";<br>  $a[]="Cinderella7";<br> <br>  $a[]="Diana1";<br>  $a[]="Diana2";<br>  $a[]="Diana3";<br>  $a[]="Diana4";<br>  $a[]="Diana5";<br>  $a[]="Diana6";<br>  $a[]="Diana7";<br> <br>  $a[]="Eva";<br>  $a[]="Fiona";<br>  $a[]="Gunda";<br>  $a[]="Hege";<br>  $a[]="Inga";<br>  $a[]="Johanna";<br>  $a[]="Kitty";<br>  $a[]="Linda";<br>  $a[]="Nina";<br>  $a[]="Ophelia";<br>  $a[]="Petunia";<br>  $a[]="Amanda";<br>  $a[]="Raquel";<br>  $a[]="Cindy";<br>  $a[]="Doris";<br>  $a[]="Eve";<br>  $a[]="Evita";<br>  $a[]="Sunniva";<br>  $a[]="Tove";<br>  $a[]="Unni";<br>  $a[]="Violet";<br>  $a[]="Liza";<br>  $a[]="Elizabeth";<br>  $a[]="Ellen";<br>  $a[]="Wenche";<div class="clear">
                 
              
              
        
            </div>
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn