可以使用Jquery下拉菜单以多种方式改善使用该网站时的用户体验。 JQuery菜单可以通过多种方法以最小的努力真正发挥作用。 其中一些示例是Jquery下拉插件,可以直接安装和使用它们而无需编写太多代码。 大多数插件都是完全可定制的,以适合您的网站,并且所有插件都需要Jquery安装程序包才能工作。 您还可以使用下拉框使用AJAX从数据库自动填充结果,这将在另一篇文章中介绍。
选择2 2.0
2012年5月6日更新: Select2 2.0是迄今为止用于jQuery下拉框和选择替换项的最佳插件。 支持多选,标签,列表,不同的数据集,ajax数据加载,无限滚动等…
1. Facebook完成
为您的用户提供类似于Facebook的动态输入,并具有自动完成和预先添加的值。
Source: http://www.emposha.com/javascript/jquery/jquerymultiselect.html
2. iPhone样式下拉菜单
“我们创建了iPod样式的向下钻取菜单,以帮助用户在控制下快速遍历分层数据。 在组织无法很好地转换为传统下拉菜单或弹出菜单的大型数据结构时,这特别有用。”
Source: http://www.filamentgroup.com/lab/jquery_ipod_style_drilldown_menu
3. 快速结果组合框
这个优雅的组合框可以预测选项,然后在您键入内容时显示出来。 它与IE有关,但有一些其他问题,就像对待对待一样。
Source: http://plugins.jquery.com/project/DDComboBox
4.动态链式组合框
这些组合框是动态的! 这意味着它们根据其他下拉菜单中选择的选项进行加载。 此方法简单但非常有效,可与AJAX调用一起使用以填充数据库中的数据。 例如,选择一个国家会加载该国家的州和城市。 动态组合框的实时演示
http://codeassembly.com/Simple-chained-combobox-plugin-for-jQuery/
5. 带有滑块的列表框
此列表框附加到一个滑块,该滑块代表在下拉框中选择的值。 可以使用下拉菜单和滑块选择该值。
http://www.senamion.com/blog/jslider_demo.html
.
From: https://www.sitepoint.com/5-awesome-jquery-drop-boxes/