5个很棒的JQuery下拉框

可以使用Jquery下拉菜单以多种方式改善使用该网站时的用户体验。 JQuery菜单可以通过多种方法以最小的努力真正发挥作用。 其中一些示例是Jquery下拉插件,可以直接安装和使用它们而无需编写太多代码。 大多数插件都是完全可定制的,以适合您的网站,并且所有插件都需要Jquery安装程序包才能工作。 您还可以使用下拉框使用AJAX从数据库自动填充结果,这将在另一篇文章中介绍。

选择2 2.0

2012年5月6日更新: Select2 2.0是迄今为止用于jQuery下拉框和选择替换项的最佳插件。 支持多选,标签,列表,不同的数据集,ajax数据加载,无限滚动等…

1. Facebook完成

为您的用户提供类似于Facebook的动态输入,并具有自动完成和预先添加的值。

facebook drop down box

Source: http://www.emposha.com/javascript/jquery/jquerymultiselect.html


2. iPhone样式下拉菜单

“我们创建了iPod样式的向下钻取菜单,以帮助用户在控制下快速遍历分层数据。 在组织无法很好地转换为传统下拉菜单或弹出菜单的大型数据结构时,这特别有用。”

the iphone drop down

Source: http://www.filamentgroup.com/lab/jquery_ipod_style_drilldown_menu


3. 快速结果组合框

这个优雅的组合框可以预测选项,然后在您键入内容时显示出来。 它与IE有关,但有一些其他问题,就像对待对待一样。

jquery-drop-down

Source: http://plugins.jquery.com/project/DDComboBox


4.动态链式组合框

这些组合框是动态的! 这意味着它们根据其他下拉菜单中选择的选项进行加载。 此方法简单但非常有效,可与AJAX调用一起使用以填充数据库中的数据。 例如,选择一个国家会加载该国家的州和城市。 动态组合框的实时演示

chained combo box






http://codeassembly.com/Simple-chained-combobox-plugin-for-jQuery/

5. 带有滑块的列表框

此列表框附加到一个滑块,该滑块代表在下拉框中选择的值。 可以使用下拉菜单和滑块选择该值。

listbox slider

 http://www.senamion.com/blog/jslider_demo.html 
 . 

From: https://www.sitepoint.com/5-awesome-jquery-drop-boxes/

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值