首頁 > 後端開發 > php教程 > PHP and AJAX Suggest_PHP教程

PHP and AJAX Suggest_PHP教程

WBOY
發布: 2016-07-13 17:07:00
原創
1378 人瀏覽過

PHP and AJAX Suggest

这个suggest是仿google的效果了,google总是走在世界的技术的前面啊,下面我们也来看看实例吧.

先看看html文件.

登入後複製
First Name:
<p>Suggestions: <span id="txtHint"></span></p>
登入後複製
下面用js文件的ajax文件来处理数据.
登入後複製
<pre class="brush:php;toolbar:false">var xmlHttp;

function showHint(str)
{
if (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML="";
  return;
  }
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
  {
  alert ("Browser does not support HTTP Request");
  return;
  } 
var url="gethint.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
} 

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
 } 
}
登入後複製
function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 // Internet Explorer
 try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}
登入後複製
 
登入後複製
这个文件只是返回php处理的数据,而我们的php文件如下.
登入後複製
<pre class="brush:php;toolbar:false"><?php // Fill up array with names
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";
登入後複製
//get the q parameter from URL
$q=$_GET["q"];
登入後複製
//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count if else output to suggestion no hint were found the correct values response echo></count>
登入後複製
好了我们的确suggest效果就完成了.
登入後複製

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/630490.htmlTechArticlePHP and AJAX Suggest 这个suggest是仿google的效果了,google总是走在世界的技术的前面啊,下面我们也来看看实例吧. 先看看html文件. form First Name:inp...
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板