php+validate实现文本框的自动完成

最新推荐文章于 2024-09-07 09:04:38 发布

置顶小菜鸟1996

最新推荐文章于 2024-09-07 09:04:38 发布

阅读量993

点赞数 3

CC 4.0 BY-SA版权

分类专栏： php 文章标签： php html 搜索插件

本文链接：https://blog.youkuaiyun.com/qq_34244050/article/details/62445433

php 专栏收录该内容

2 篇文章

订阅专栏

这里写图片描述

一般的搜索框都会有这种候选的功能，那这种效果是怎么实现的呢？
我简单的做了一个
准备材料：
1.本地php环境
2.jquery（版本随意）
3.validate插件点击下载

代码如下
html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--加载静态文件-->
    <script src="jquery-1.8.3.js"></script>
    <script src="validate/jquery.validate.js"></script>
    <script src="validate/jquery-ui-1.10.3.custom.js"></script>
    <link rel="stylesheet" href="validate/smoothness/jquery-ui-1.10.3.custom.css" type="text/css"/>
    <script charset="utf-8" src="validate/jquery.validate.messages_zh.js"></script>
</head>
<body>



<form  >
    <input type="text" id="search"  />

</form>


<script>
    //调用自动补全的插件
    $("#search").autocomplete({
        "source": function (request, response) {
            //用户输入的关键字
            var content = request.term;


            $.ajax({
                'url':"test.php?w="+content,
                dataType:'json',
                success:function (re) {


                    response(re);

                }


            });



        }


    });


</script>


</body>
</html>

php

<?php


    //获取关键字
    $word=$_GET['w'];

    //连接数据库并对对应字段进行模糊搜索
    $dsn="mysql:host=localhost;dbname=user";
    $username="root";
    $password="root";

    $db=new PDO($dsn,$username,$password);


    $spl="select * from user where username like '%{$word}%'";

    $s= $db->prepare($spl);

    $s->execute();


    $arr=array();
    while ($row=$s->fetch(PDO::FETCH_ASSOC)){

        $arr[]=$row['username'];


    }
    //将搜索到的结果转成json传给前端
    //这里如果有中文可能再转json时出现乱码，至于怎么解决去百度吧
    echo json_encode($arr);