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 相关文章推荐
php 获取客户端的真实ip
Nov 30 PHP
PHP设计模式之命令模式的深入解析
Jun 13 PHP
百度站点地图(百度sitemap)生成方法分享
Jan 09 PHP
文件上传之SWFUpload插件(代码)
Jul 30 PHP
PHP实现简单实用的分页类代码
Apr 08 PHP
php自定义函数转换html标签示例
Sep 29 PHP
PHP读取大文件的几种方法介绍
Oct 27 PHP
浅谈Laravel中的一个后期静态绑定
Aug 11 PHP
php语言注释,单行注释和多行注释
Jan 21 PHP
yii2 url重写并隐藏index.php方法
Dec 10 PHP
thinkPHP框架乐观锁和悲观锁实例分析
Oct 30 PHP
PHP使用Redis队列执行定时任务实例讲解
Mar 24 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木马webshell扫描器代码
2012/01/25 PHP
解析yahoo邮件用phpmailer发送的实例
2013/06/24 PHP
php使用flock阻塞写入文件和非阻塞写入文件的实例讲解
2017/07/10 PHP
Yii2框架类自动加载机制实例分析
2018/05/02 PHP
checkbox 复选框不能为空
2009/07/11 Javascript
基于jQuery实现模拟页面加载进度条
2013/04/01 Javascript
有关于JS构造函数的重载和工厂方法
2013/04/07 Javascript
将list转换为json失败的原因
2013/12/17 Javascript
CSS3实现动态背景登录框的代码
2015/07/28 Javascript
SublimeText自带格式化代码功能之reindent
2015/12/27 Javascript
jQuery实现右键菜单、遮罩等效果代码
2016/09/27 Javascript
Vue组件通信的四种方式汇总
2018/02/08 Javascript
基于JavaScript实现幸运抽奖页面
2020/07/05 Javascript
纯JS实现可用于页码更换的飞页特效示例
2018/05/21 Javascript
vue中使用echarts的示例
2021/01/03 Vue.js
[02:28]DOTA2英雄基础教程 灰烬之灵
2013/12/19 DOTA
使用python实现接口的方法
2017/07/07 Python
浅谈python jieba分词模块的基本用法
2017/11/09 Python
在pycharm中python切换解释器失败的解决方法
2018/10/29 Python
在PyCharm下打包*.py程序成.exe的方法
2018/11/29 Python
Python玩转加密的技巧【推荐】
2019/05/13 Python
Python内存管理实例分析
2019/07/10 Python
Django使用消息提示简单的弹出个对话框实例
2019/11/15 Python
python GUI库图形界面开发之PyQt5访问系统剪切板QClipboard类详细使用方法与实例
2020/02/27 Python
使用python 计算百分位数实现数据分箱代码
2020/03/03 Python
Python如何执行系统命令
2020/09/23 Python
使用canvas一步步实现图片打码功能的方法
2019/06/17 HTML / CSS
中国综合网上购物商城:苏宁易购
2016/08/09 全球购物
路由表示做什么用的?在linux环境中怎么来配置一条默认路由?
2013/06/07 面试题
综合办公室主任职责
2013/12/16 职场文书
药剂专业个人求职信范文
2014/04/29 职场文书
职务说明书范文
2014/05/07 职场文书
班风口号
2014/06/18 职场文书
财务会计实训报告
2014/11/05 职场文书
2016年学校“6﹒26国际禁毒日”宣传活动总结
2016/04/05 职场文书
MySQL创建高性能索引的全步骤
2021/05/02 MySQL