现在的位置: 首页 > 综合 > 正文

wed前端技术如何写一个搜索框实时根据你输入的词条进行联想在下拉框

2019年11月12日 综合 ⁄ 共 377字 ⁄ 字号 评论关闭

  最近做了一个功能,大概需求是这样的,在一个搜索框输入词汇,搜索框会根据你输入的词汇实时监听,匹配符合条件的词汇放在下拉框,来让你选择,选择完后敲回车键跳到指定的搜索。这么做的目的是提高你检索的效率。前两天做了第一个版本,今天又改进了一下,在此把两个版本的都记在笔记上。

  注意:因为本人结合了自己的实际的业务需求,可能不太满足你的需求,在此只是给你提供一个思路和做法,具体的还需要自己去改吧改吧。下面开始第一个版本

  第一个版本并没有做下拉框,只是单纯做到匹配后就实时的输入到了搜索框,然后敲回车。第一个版本是表单提交。

  需要引入三个文件:需要文件的朋友请给我留言

  总结:

  表单的提交其实可以换成ajax去提交的,但是表单会带有自动刷新,在这里只能自己去手动刷新。

  如果是为你手动渲染出来的dom去绑定点击事件,那么请用本案例里面的绑定方法。

抱歉!评论已关闭.