简单的百度预测搜索功能（php+jQuery+js+ajax）

前端代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

</head>
<body>
<script type="text/javascript">
function test(){
   $.ajax({
       url:'hou.php',
       data:{area:$('#area').val()},
       dataType:'json',
       type:'POST',
       success:function(data){
           $("div").empty();
           $.each(data,function(i,n){
               if(n!=','){
               $("div").append(n);
               }
               else{
                   $("div").append('<br>');
               }
           })


       },
   });
}
</script>
<input type="text" ></div>
</body>
</html>

后端代码：

<?php
$_array=array(
   '1'=>'abc',
   '2'=>'acd',
   '3'=>'jack',
   '4'=>'jimmy',
   '5'=>'json');
$_result=json_encode($_array);
$key=$_POST['area'];//此处用get提交的可以用get获得，用post提交的用post获得，两者都可以用request
$size=count($_array);

$pattern= '/'.'^'.($key).'/';

$str="";
if($key!=null&&strlen($key)!=0)
       for($i=1;$i<=$size;++$i){

       if(preg_match($pattern,$_array["$i"])){

       $str=$str.$_array[$i].',';
       }
   }
$str=json_encode($str);
echo $str;

?>

简单的百度预测搜索功能（php+jQuery+js+ajax）

相关推荐