layui下拉列表select实现可输入查找的方法


Posted in Javascript onSeptember 28, 2019

如下图,这是一个layui的下拉列表select,随着下拉数据越来越多,我们找某个选项就比较吃力了。

layui下拉列表select实现可输入查找的方法

这是原下拉列表的代码(数据是从后台传来的):

layui下拉列表select实现可输入查找的方法

为了解决这个问题,我们可以将select改为可以筛选的格式,如下图。

layui下拉列表select实现可输入查找的方法

具体如何操作?其实很简单,在原select元素中加入 lay-search 即可。

layui下拉列表select实现可输入查找的方法

以上这篇layui下拉列表select实现可输入查找的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript面向对象设计二 构造函数模式
Dec 20 Javascript
Javascript继承(上)——对象构建介绍
Nov 08 Javascript
javascript 使td内容不换行不撑开
Nov 29 Javascript
JavaScript图片放大技术(放大镜)实现代码分享
Nov 14 Javascript
现如今最流行的JavaScript代码规范
Mar 08 Javascript
jquery常用操作小结
Jul 21 Javascript
谈谈JavaScript自定义回调函数
Oct 18 Javascript
jQuery插件formValidator实现表单验证
May 23 Javascript
Ubuntu系统下Angularjs开发环境安装
Sep 01 Javascript
Angular2  NgModule 模块详解
Oct 19 Javascript
解决vue同一slot在组件中渲染多次的问题
Sep 06 Javascript
如何通过简单的代码描述Angular父组件、子组件传值
Apr 07 Javascript
解决layui下拉框监听问题(监听不到值的变化)
Sep 28 #Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
Sep 28 #Javascript
layer.confirm()右边按钮实现href的例子
Sep 27 #Javascript
layer页面跳转,获取html子节点元素的值方法
Sep 27 #Javascript
使用layer模态框给新页面传值的方法
Sep 27 #Javascript
JavaScript实现随机五位数验证码
Sep 27 #Javascript
layer弹出层倒计时关闭的实现方法
Sep 27 #Javascript
You might like
雄兵连三大错觉:凯莎没了,凉冰阵亡了,华烨觉得自己又行了
2020/04/09 国漫
PHP缩略图等比例无损压缩,可填充空白区域补充色
2011/06/10 PHP
简单的php中文转拼音的实现代码
2014/02/11 PHP
php+ajax实现无刷新的新闻留言系统
2020/12/21 PHP
php版微信js-sdk支付接口类用法示例
2016/10/12 PHP
PHP实现用session来实现记录用户登陆信息
2018/10/15 PHP
JQuery 表格操作(交替显示、拖动表格行、选择行等)
2009/07/29 Javascript
javascript中"/"运算符常见错误
2010/10/13 Javascript
JS跨域代码片段
2012/08/30 Javascript
jquery实现的缩略图预览滑块实例
2015/06/25 Javascript
javascript的replace方法结合正则使用实例总结
2016/06/16 Javascript
BootStrap 标题设置跨行无效的解决方法
2017/10/25 Javascript
JS遍历DOM文档树的方法实例详解
2018/04/03 Javascript
Bootstrap 模态框自定义点击和关闭事件详解
2018/08/10 Javascript
小程序实现授权登陆的解决方案
2018/12/02 Javascript
Vue 之孙组件向爷组件通信的实现
2019/04/23 Javascript
使用watch在微信小程序中实现全局状态共享
2019/06/03 Javascript
node创建Vue项目步骤详解
2020/03/06 Javascript
JavaScript 实现继承的几种方式
2021/02/19 Javascript
python 不关闭控制台的实现方法
2011/10/23 Python
浅谈Python中的zip()与*zip()函数详解
2018/02/24 Python
python 实现判断ip连通性的方法总结
2018/04/22 Python
PyQt5 窗口切换与自定义对话框的实例
2019/06/20 Python
Python Tornado批量上传图片并显示功能
2020/03/26 Python
Django中如何用xlwt生成表格的方法步骤
2021/01/31 Python
CSS3 3D旋转rotate效果实例介绍
2016/05/03 HTML / CSS
Html5上传图片 移动端、PC端通用代码
2016/06/08 HTML / CSS
浅析HTML5页面元素及属性
2021/01/20 HTML / CSS
环境科学专业优秀毕业生自荐书
2014/02/03 职场文书
小学敬老月活动方案
2014/02/11 职场文书
优秀的应届生自荐信
2014/05/23 职场文书
小学教师个人总结
2015/02/05 职场文书
亮剑观后感500字
2015/06/05 职场文书
2016年小学教师政治学习心得体会
2016/01/23 职场文书
winserver2019安装软件一直卡在应用程序正在为首次使用做准备
2022/06/10 Servers
MYSQL中文乱码问题的解决方案
2022/06/14 MySQL