• 售前

  • 售后

热门帖子
入门百科

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

[复制链接]
静美人2017 显示全部楼层 发表于 2021-10-25 19:23:08 |阅读模式 打印 上一主题 下一主题
本文实例报告了PHP+JS实现的实时搜刮提示功能。分享给大家供大家参考,详细如下:
效果图如下:

代码如下:
HTML代码:(该代码用两种方法实现,一种Jquery,一种原生JS)
  1. <html>
  2. <head>
  3.   <script src="/DelphiRequest/search/js/jquery.js"></script>
  4.   <script>
  5. /*用原生js实现
  6. //    function showResult(str)
  7. //    {
  8. //      if (str.length==0)
  9. //      {
  10. //        document.getElementById("livesearch").innerHTML="";
  11. //        document.getElementById("livesearch").style.border="0px";
  12. //        return;
  13. //      }
  14. //      if (window.XMLHttpRequest)
  15. //      {// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行
  16. //        xmlhttp=new XMLHttpRequest();
  17. //      }
  18. //      else
  19. //      {// IE6, IE5 浏览器执行
  20. //        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  21. //      }
  22. //      xmlhttp.onreadystatechange=function()
  23. //      {
  24. //        if (xmlhttp.readyState==4 && xmlhttp.status==200)
  25. //        {
  26. //          document.getElementById("livesearch").innerHTML=xmlhttp.responseText;
  27. //          document.getElementById("livesearch").style.border="1px solid #A5ACB2";
  28. //        }
  29. //      }
  30. //      xmlhttp.open("GET","livesearch.php?q="+str,true);
  31. //      xmlhttp.send();
  32. //    }
  33. */
  34. //用jquery实现
  35.      function showResult(str){
  36.        $.ajax({
  37.          type: "GET",
  38.          url : "livesearch.php",
  39.          datatype : 'json',
  40.          data: {'q':str} ,
  41.          success :function (data) {
  42.            document.getElementById("livesearch").innerHTML=data;
  43.            document.getElementById("livesearch").style.border="1px solid #A5ACB2";
  44.          }
  45.        })
  46.      }
  47.   </script>
  48. </head>
  49. <body>
  50. <form>
  51.   <input type="text" size="30" onkeyup="showResult(this.value)">
  52.   <div id="livesearch"></div>
  53. </form>
  54. </body>
  55. </html>
复制代码
PHP代码如下:(PHP不仅可以思量直接使用数组,也可以思量直接查询数据库,获取数据库内容,本代码使用的是数组。)
  1. <?php
  2. $provinces=array("beijing","tianjin","shanghai","chongqing","hebei","henan","heilongjiang","jilin","changchun",
  3.   "shandong","anhui","shanxi","guangzhou","yunnan","hainan","xizang","qinghai","fujian","guizhou","jiangsu",
  4.   "zhejiang","guangzhou","yunan","hainan","xizang","neimenggu","sichuan","gansu","ningxia","xianggang","aomen");
  5. $tmp=$_GET['q'];
  6. $val=array();
  7. $k=0;
  8. if (strlen($tmp)>0)
  9. {
  10.   for($i=0;$i<31;$i++){
  11.     if(strpos($provinces[$i],$tmp)!==false){
  12.        //传递值给val
  13.        $val[$k]=$provinces[$i];
  14.        //下标增加
  15.        $k=$k+1;
  16.     }
  17.   }
  18.   //遍历val数组
  19.   for($j=0;$j<count($val);$j++)
  20.   {
  21.     echo $val[$j];
  22.     echo "<br>";
  23.   }
  24. }
  25. ?>
复制代码
更多关于PHP相关内容感兴趣的读者可查察本站专题:《PHP数据布局与算法教程》、《php程序计划算法总结》、《PHP+ajax技巧与应用小结》、《PHP网络编程技巧总结》、《php字符串(string)用法总结》、《PHP数组(Array)利用技巧大全》及《PHP常用遍历算法与技巧总结》
盼望本文所述对大家PHP程序计划有所帮助。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

帖子地址: 

回复

使用道具 举报

分享
推广
火星云矿 | 预约S19Pro,享500抵1000!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

草根技术分享(草根吧)是全球知名中文IT技术交流平台,创建于2021年,包含原创博客、精品问答、职业培训、技术社区、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区。
  • 官方手机版

  • 微信公众号

  • 商务合作