select下拉搜索(Select2数据量大时卡顿问题)

您所在的位置:网站首页 bootstrap-select数据过多 select下拉搜索(Select2数据量大时卡顿问题)

select下拉搜索(Select2数据量大时卡顿问题)

2024-02-01 21:17| 来源: 网络整理| 查看: 265

场景:之前遇到一个前后端一体的老项目使用了Select2,select下的数据都是通过 controllers 一次性带过来的。后面数据量变大后,Select2切换选项时就会出现严重的卡顿问题

可能有人会说,使用分页加载不就行了。但我尝试后发现 加载到一定数据量后,切换选项同样会出现问题

最后决定放弃使用Select2,自己写个 select下拉搜索

文件链接:https://download.csdn.net/download/weixin_44646763/86247616

gitHub链接: https://github.com/1499610503/search_select

因为代码中使用了jq 所以引入search_select.js 前需先引入 jq

也不要忘了引入search_select.css

使用方法:

var ss1 = new SearchSelect('#text_search_select',{placeholder:'输入搜索内容'})

第一个参数为 目标select元素的 css选择器 ,placeholder不传时默认为空 placeholder为 搜索input 的 placeholder值

可给select添加额外的项:

ss1.addSelectOption([{ value: 5, text: 'option5' }, { value: 6, text: 'option6' }, { value: 7, text: 'option7' }, { value: 8, text: 'option8' }, ])


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3