各位你们好，php+ajax搜索文本框下方提示功能
- WBOYオリジナル
- 2016-06-13 11:52:58958ブラウズ
各位大虾你们好，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>声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：python scp自动登录解决方法次の記事：jq调用数据库,该怎么处理