怎么用js写下拉框？

Question

http://www.39.net/
http://hao.360.cn/
也就是这两个网站上搜索框之前的选择搜索种类的效果，以前从没接触过js，现在要求一个上午写出来，哭了，谁能给个思路？或者是现成的源码，谢了，用jquery也行

Answer 1

直接用CSS也能制作很棒的下拉菜单的说，这里给你推荐一篇文章：如何利用 CSS 製作多級選單？
希望能帮到你。

Answer 2

jquery有个Plugin可以用：jQuery AutoComplete
Bootstrap也有类似的Plugin：Bootstrap typeahead

原理上来说就是在Keyup的时候做regular expression的匹配，在下拉框里插入符合条件的结果，然后显示隐藏的下拉框。还有很多细节可以考虑，比如鼠标点下拉框如何，有些时候keyup的时候需要用AJAX去后台拿结果，如果点击了除了搜索框和下拉框的其他地方，下拉框应该隐藏等细节。

Answer 3

如果你愿意使用jquery-easy-ui,那么里面的combobox可以达到你要的效果。
具体的Demo,请查看http://www.jeasyui.com/demo/index.php...，Form->combobox.

关于easy-ui的使用，建议你查看一下官方文档：http://www.jeasyui.com/documentation/...
也有一份中文版的：
http://www.cnblogs.com/Philoo/archive...
希望能对你有所帮助。

Answer 4

可以参考，ToFishes系列jQuery插件之jSuggest – 搜索框输入框自动下拉提示内容补全插件：http://cssor.com/tofishes-jquery-plug...

Answer 5

其实思路比较简单的，我也简单说一下，最普通的方式：
1、把样式都写好，包括下拉框显示出来的效果，一般为了达到弹出菜单的效果，所以用绝对定位对展开的下拉框进行定位
2、把写好的下拉框用 css 进行隐藏
3、给要触发下拉框的元素绑定事件，click 或者 mouseover，然后触发事件的时候，判断切换一下下拉框的显示和不显示