- 资源介绍
- 更新记录
- 安装教程
这是一款jQuery实现带搜索过滤功能的下拉列表框,可以多选项进行分组,设置选项的图标,对选项进行搜索过滤,以及进行多选选择。
JS代码
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script> <script src="js/fm.selectator.jquery.js"></script> <script> $(function () { var $activate_selectator1 = $('#activate_selectator1'); $activate_selectator1.click(function () { var $select1 = $('#select1'); if ($select1.data('selectator') === undefined) { $select1.selectator({ labels: { search: 'Search here...' } }); $activate_selectator1.val('destroy selectator'); } else { $select1.selectator('destroy'); $activate_selectator1.val('activate selectator'); } }); $activate_selectator1.trigger('click'); var $activate_selectator2 = $('#activate_selectator2'); $activate_selectator2.click(function () { var $select2 = $('#select2'); if ($select2.data('selectator') === undefined) { $select2.selectator({ useDimmer: true }); $activate_selectator2.val('destroy selectator'); } else { $select2.selectator('destroy'); $activate_selectator2.val('activate selectator'); } }); $activate_selectator2.trigger('click'); var $activate_selectator3 = $('#activate_selectator3'); $activate_selectator3.click(function () { var $select3 = $('#select3'); if ($select3.data('selectator') === undefined) { $select3.selectator({ useSearch: false }); $activate_selectator3.val('destroy selectator'); } else { $select3.selectator('destroy'); $activate_selectator3.val('activate selectator'); } }); $activate_selectator3.trigger('click'); var $activate_selectator4 = $('#activate_selectator4'); $activate_selectator4.click(function () { var $select4 = $('#select4'); if ($select4.data('selectator') === undefined) { $select4.selectator({ showAllOptionsOnFocus: true }); $activate_selectator4.val('destroy selectator'); } else { $select4.selectator('destroy'); $activate_selectator4.val('activate selectator'); } }); $activate_selectator4.trigger('click'); var $activate_selectator5 = $('#activate_selectator5'); $activate_selectator5.click(function () { var $select5 = $('#select5'); if ($select5.data('selectator') === undefined) { $select5.selectator({ useSearch: false }); $activate_selectator5.val('destroy selectator'); } else { $select5.selectator('destroy'); $activate_selectator5.val('activate selectator'); } }); $activate_selectator5.trigger('click'); var $activate_selectator6 = $('#activate_selectator6'); $activate_selectator6.click(function () { var $select6 = $('#select6'); if ($select6.data('selectator') === undefined) { $select6.selectator({ showAllOptionsOnFocus: true, keepOpen: true }); $activate_selectator6.val('destroy selectator'); } else { $select6.selectator('destroy'); $activate_selectator6.val('activate selectator'); } }); $activate_selectator6.trigger('click'); }); </script>
猜你喜欢
-
CSS3 3D弹簧跳动动画特效
2021-02-13 -
CSS3扁平化谷歌Loading加载图标动画特效
2021-02-13 -
CSS3绘制3D银行卡片层叠展示特效
2021-02-13 -
按住鼠标左键选中区域元素框js代码
2021-02-13 -
点击关键词出现更多动感文字特效
2021-02-07 -
js+css3精美质感圆形时钟网页特效
2021-02-07 -
jQuery实现鼠标滚轮控制div上下翻动效果
2021-02-07 -
js指定打印页面部分内容代码
2021-02-07 -
简单的CSS3旋转原子动画特效
2021-02-13 -
基于vue.js实现的九宫格抽奖代码
2021-02-07
-
HTML5 3D立方体按钮动画翻转特效
2021-02-13 -
css3 svg精美圆角修边登录注册按钮特效
2021-02-07 -
jquery简洁时尚滑动提示注册页面
2021-02-07 -
CSS3创意圆盘数字时钟动画特效
2021-02-13 -
CSS3告白爱心跳动动画特效
2021-02-13 -
vsPlayAudio在线音乐播放插件
2021-02-07 -
css3打乒乓球动画特效
2021-02-13 -
支持背景色为渐变模式且可自动切换的jQuery插件
2021-02-13 -
html5自定义搜索选项交互式搜索表单代码
2021-02-13 -
CSS3灰色质感音箱播放动画特效
2021-02-13
猜你在找
1. 本站所有资源来源于用户上传和网络,因此不包含技术服务请大家谅解!如有侵权请邮件联系客服!lyebiz@qq.com
2. 本站不保证所提供下载的资源的准确性、安全性和完整性,资源仅供下载学习之用!如有链接无法下载、失效或广告,请联系客服处理,有奖励!
3. 您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容资源!如用于商业或者非法用途,与本站无关,一切后果请用户自负!
4. 如果您也有好的资源或教程,您可以投稿发布,成功分享后有站币奖励和额外收入!
优源网 » jQuery带搜索过滤功能的下拉列表框
优源网 » jQuery带搜索过滤功能的下拉列表框
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用?
- 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了?
- 找不到素材资源介绍文章里的示例图片?
- 资源不能下载?
- 2021-02-13Hi,初次和大家见面了,请多关照!