广告合作
  • 今日头条

    今日头条

  • 百度一下

    百度一下,你就知道

  • 新浪网

    新浪网 - 提供新闻线索,重大新闻爆料

  • 搜狐

    搜狐

  • 豆瓣

    豆瓣

  • 百度贴吧

    百度贴吧——全球领先的中文社区

  • 首页 尚未审核订阅工具 订阅

    百度搜索引擎下拉框怎么做

    来源:网络收集  点击:  时间:2024-02-08
    【导读】:
    我们在平时登录网站时,可能会发现一种功能,就是在使用搜索引擎进行搜索时,会在搜索引擎的输入框提示出多个可能搜索的条目,用户体验非常的好,那么,搜索引擎下拉框怎么做呢,自动补全提示搜索怎么做呢,下面本文就介绍一下。方法/步骤1/8分步阅读

    实现该功能需依赖jquery.js,jquery.autocomplete.js,先引入这两个js包,以及jquery.autocomplete.css样式文件,

    如图所示。

    2/8

    该不全插件要结合input元素使用,也就是在input中进行搜索时,会达到自动提示补全的效果,在html文件中定义input元素,以下是部分代码截图,如图所示。

    3/8

    那么使用autocomplete自动补全插件,也就非常简单了,下面下介绍一下最简单的使用方法,只要把要搜索的数据放进一个数组之中即可,

    var language = ;

    然后使用

    $(#end).autocomplete({

    source:

    });即可,代码如图所示。

    4/8

    下面我们可以看一下运行结果,比方说搜索带有C字的语言,如图所示。

    5/8

    下面我们看一下怎么和后台数据结合起来,可以与ajax一起使用,将ajax返回的数据作为上面的数组,直接赋给autocomplete插件使用,代码如图所示。

    6/8

    下面可以看一下真是的效果,可以看到,搜索“上”字之后,可以自动查询出数据库中所有带有上字的地址,如图所示。

    7/8

    当然了,样式也是可以自己进行调整的,使用起来非常的简单方便。

    8/8

    以上就是搜索引擎下拉框怎么做的方法介绍,希望可以帮到大家。

    百度百度搜索样式搜索自动提示搜索自动补全
    本文关键词:

    版权声明:

    1、本文系转载,版权归原作者所有,旨在传递信息,不代表看本站的观点和立场。

    2、本站仅提供信息发布平台,不承担相关法律责任。

    3、若侵犯您的版权或隐私,请联系本站管理员删除。

    4、文章链接:http://www.1haoku.cn/art_15261.html

    ©2019-2020 http://www.1haoku.cn/ 国ICP备20009186号05-21 07:50:44  耗时:0.025