PHP+JS实现的实时搜索提示功能


Posted in PHP onMarch 13, 2018

本文实例讲述了PHP+JS实现的实时搜索提示功能。分享给大家供大家参考,具体如下:

效果图如下:

PHP+JS实现的实时搜索提示功能

代码如下:

HTML代码:(该代码用两种方法实现,一种Jquery,一种原生JS)

<html>
<head>
  <script src="/DelphiRequest/search/js/jquery.js"></script>
  <script>
/*用原生js实现
//    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();
//    }
*/
//用jquery实现
     function showResult(str){
       $.ajax({
         type: "GET",
         url : "livesearch.php",
         datatype : 'json',
         data: {'q':str} ,
         success :function (data) {
           document.getElementById("livesearch").innerHTML=data;
           document.getElementById("livesearch").style.border="1px solid #A5ACB2";
         }
       })
     }
  </script>
</head>
<body>
<form>
  <input type="text" size="30" onkeyup="showResult(this.value)">
  <div id="livesearch"></div>
</form>
</body>
</html>

PHP代码如下:(PHP不仅可以考虑直接使用数组,也可以考虑直接查询数据库,获取数据库内容,本代码使用的是数组。)

<?php
$provinces=array("beijing","tianjin","shanghai","chongqing","hebei","henan","heilongjiang","jilin","changchun",
  "shandong","anhui","shanxi","guangzhou","yunnan","hainan","xizang","qinghai","fujian","guizhou","jiangsu",
  "zhejiang","guangzhou","yunan","hainan","xizang","neimenggu","sichuan","gansu","ningxia","xianggang","aomen");
$tmp=$_GET['q'];
$val=array();
$k=0;
if (strlen($tmp)>0)
{
  for($i=0;$i<31;$i++){
    if(strpos($provinces[$i],$tmp)!==false){
       //传递值给val
       $val[$k]=$provinces[$i];
       //下标增加
       $k=$k+1;
    }
  }
  //遍历val数组
  for($j=0;$j<count($val);$j++)
  {
    echo $val[$j];
    echo "<br>";
  }
}
?>

希望本文所述对大家PHP程序设计有所帮助。

PHP 相关文章推荐
织梦模板标记简介
Mar 11 PHP
php多个字符串替换成同一个的解决方法
Jun 18 PHP
解析php如何将日志写进syslog
Jun 28 PHP
本地机apache配置基于域名的虚拟主机详解
Aug 10 PHP
mantis安装、配置和使用中的问题小结
Jul 14 PHP
PHP扩展模块memcached长连接使用方法分析
Dec 24 PHP
PHP实现Javascript中的escape及unescape函数代码分享
Feb 10 PHP
php通过function_exists检测函数是否存在的方法
Mar 18 PHP
详解PHP中的Traits
Jul 29 PHP
在Thinkphp中使用ajax实现无刷新分页的方法
Oct 25 PHP
php之可变变量的实例详解
Sep 12 PHP
基于PHP实现用户在线状态检测
Nov 10 PHP
PHP实现的简单路由和类自动加载功能
Mar 13 #PHP
php生成复杂验证码(倾斜,正弦干扰线,黏贴,旋转)
Mar 12 #PHP
php把字符串指定字符分割成数组的方法
Mar 12 #PHP
bindParam和bindValue的区别以及在Yii2中的使用详解
Mar 12 #PHP
php取出数组单个值的方法
Mar 12 #PHP
php合并数组并保留键值的实现方法
Mar 12 #PHP
php删除二维数组中的重复值方法
Mar 12 #PHP
You might like
php增删改查示例自己写的demo
2013/09/04 PHP
php实现webservice实例
2014/11/06 PHP
PHP中使用substr()截取字符串出现中文乱码问题该怎么办
2015/10/21 PHP
Laravel框架控制器的request与response用法示例
2019/09/30 PHP
给jqGrid数据行添加修改和删除操作链接(之一)
2011/11/04 Javascript
js中widow.open()方法使用详解
2013/07/30 Javascript
可简单避免的三个JS发布错误的详细介绍
2013/08/02 Javascript
json数据的列循环示例
2013/09/06 Javascript
javascript实现模拟时钟的方法
2015/05/13 Javascript
jquery实现的代替传统checkbox样式插件
2015/06/19 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
JavaScript利用闭包实现模块化
2017/01/13 Javascript
基于jstree使用AJAX请求获取数据形成树
2017/08/29 Javascript
angular4实现tab栏切换的方法示例
2017/10/21 Javascript
浅谈react 同构之样式直出
2017/11/07 Javascript
详解使用mpvue开发github小程序总结
2018/07/25 Javascript
nodejs对项目下所有空文件夹创建gitkeep的方法
2019/08/02 NodeJs
JS用最简单的方法实现四舍五入
2019/08/27 Javascript
微信小程序定义和调用全局变量globalData的实现
2019/11/01 Javascript
Angular封装表单控件及思想总结
2019/12/11 Javascript
JS实现可控制的进度条
2020/03/25 Javascript
Vue3.0的优化总结
2020/10/16 Javascript
Python中装饰器高级用法详解
2017/12/25 Python
pytorch + visdom CNN处理自建图片数据集的方法
2018/06/04 Python
pip安装py_zipkin时提示的SSL问题对应
2018/12/29 Python
在python中使用pymysql往mysql数据库中插入(insert)数据实例
2020/03/02 Python
如何使用scrapy中的ItemLoader提取数据
2020/09/30 Python
python 决策树算法的实现
2020/10/09 Python
python爬取代理IP并进行有效的IP测试实现
2020/10/09 Python
新秀丽拉杆箱美国官方网站:Samsonite美国
2016/07/25 全球购物
大学生职业生涯规划书模板
2014/01/03 职场文书
公益活动邀请函
2014/02/05 职场文书
大学生入党积极分子自我评价
2014/09/20 职场文书
志愿服务心得体会
2016/01/15 职场文书
解决golang 关于全局变量的坑
2021/05/06 Golang
使用CSS定位HTML元素的实现方法
2022/07/07 HTML / CSS