layui下拉框怎么关闭自动补全搜索

夏伟大大_6003

夏伟大大_6003

2026-09-21

136人浏览

原创

关闭layui下拉框自动补全需三步协同:1.设lay-search="false"属性;2.调form.render('select');3.手动移除残留输入框dom,缺一不可。

layui下拉框怎么关闭自动补全搜索

关闭 Layui 下拉框的自动补全搜索,本质是关掉 lay-search 的 DOM 级过滤行为。只改属性或只删输入框都不行,必须三步协同——否则要么留白框,要么下次 form.render() 又弹回来。

为什么 search: falseselect.render() 里没用

Layui 2.8–2.9 主流版本的 select.render() 不识别 search: false 配置项。这个参数是 3.0+ 才加的,当前线上项目基本跑在 2.8.x 上,写了等于白写。文档没标清版本差异,容易踩坑。

正确关闭流程(三步缺一不可)

以下操作需在 layui.use('form', function(){...}) 回调内执行,确保 form 实例可用:

深蓝色网站后台管理系统layui框架模板-AdminPro
深蓝色网站后台管理系统layui框架模板-AdminPro

一款深蓝色网站后台管理系统layui框架模板

下载
  • $('select#mySelect').attr('lay-search', 'false') 显式关闭属性(注意是字符串 'false',不是布尔值)
  • 立即调用 form.render('select'),让 layui 重新解析该 select 的配置
  • 手动清理残留 DOM:$('select#mySelect').siblings('.layui-form-select').find('.layui-input').remove()

漏掉第三步,2.8.x 会在下拉面板顶部留下一个空输入框;漏掉前两步,DOM 清了但下次 form.render() 会根据原始 HTML 属性重建它。

远程搜索场景下更要关掉本地补全

如果你用 select.render() 配了 request 做远程加载,lay-search="true" 会导致双重过滤:先在已有选项里筛一遍,再发请求——输“杭州”可能根本搜不到后端刚返回的“杭州市西湖区”。

  • 务必显式设 lay-search="false",别依赖默认值
  • 如果用了自定义模板(templet),lay-search 本就失效,关不关都一样,但留着会误导后续维护
  • 移动端慎用:某些安卓 WebView 下,lay-search 输入框会触发软键盘后失焦,导致下拉收起,用户根本点不到选项

真正麻烦的不是怎么关,而是关完要不要留输入框样式——如果只是想隐藏搜索行为但保留输入框视觉,得靠 CSS 控制 .layui-inputdisplay,而不是开 lay-search 再 hack。

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

layui下拉框 layui

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
ajax教程
ajax教程

php中文网为大家带来ajax教程合集,Ajax是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。php中文网还为大家带来ajax的相关下载资源、相关课程以及相关文章等内容,供大家免费下载使用。

2023.06.14

2260

4

ajax中文乱码解决方法
ajax中文乱码解决方法

ajax中文乱码解决方法有设置请求头部的字符编码、在服务器端设置响应头部的字符编码和使用encodeURIComponent对中文进行编码。本专题为大家提供ajax中文乱码相关的文章、下载、课程内容,供大家免费下载体验。

2023.08.31

340

5

ajax传递中文乱码怎么办
ajax传递中文乱码怎么办

ajax传递中文乱码的解决办法:1、设置统一的编码方式;2、服务器端编码;3、客户端解码;4、设置HTTP响应头;5、使用JSON格式。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2023.11.15

2093

5

ajax网站有哪些
ajax网站有哪些

使用ajax的网站有谷歌、维基百科、脸书、纽约时报、亚马逊、stackoverflow、twitter、hacker news、shopify和basecamp等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.09.24

1121

6

NumPy性能优化版本更新与常见报错排查
NumPy性能优化版本更新与常见报错排查

本专题整理 NumPy 性能优化、版本更新与常见报错排查相关教程,覆盖向量化计算、广播性能、内存布局、NumPy 2.0 升级、版本兼容冲突、安装导入报错、dtype 溢出、矩阵运算异常和 broadcasting 报错修复,帮助读者系统掌握 NumPy 性能调优与问题定位方法。

2026.09.22

0

25

Vibeknow在线使用入口合集
Vibeknow在线使用入口合集

本专题汇总了Vibeknow在线创作视频的官方入口及网页版使用教程,涵盖PPT、PDF、Word等文档一键转讲解视频的核心操作,并整理了免费版水印规则与手机端浏览器访问指南,助你快速将知识内容视频化。

2026.09.21

20

20

NumPy随机数文件读写与dtype数据类型
NumPy随机数文件读写与dtype数据类型

本专题整理 NumPy 随机数、文件读写与 dtype 数据类型相关教程,覆盖 Generator/random、随机数种子、正态分布采样、npy/npz/CSV/TXT 保存读取、loadtxt/savetxt、memmap、大文件处理、astype 类型转换、结构化 dtype、整数溢出和精度丢失等场景。

2026.09.21

20

24

NumPy矩阵运算与线性代数计算
NumPy矩阵运算与线性代数计算

本专题整理 NumPy 矩阵运算与线性代数计算相关教程,覆盖矩阵乘法、dot 与 @ 运算符、逆矩阵、行列式、特征值与特征向量、SVD、线性方程组、欧氏距离、矩阵分解和大规模矩阵性能优化等内容,帮助读者掌握 np.linalg 与矩阵计算实战。

2026.09.21

0

20

NumPy广播机制数学运算与统计分析
NumPy广播机制数学运算与统计分析

本专题整理 NumPy 广播机制、数组数学运算与统计分析相关教程,覆盖广播规则、维度对齐、矩阵与数组加减除法、向量化计算、均值方差、分位数、中位数、直方图和 unique 频次统计等场景,帮助读者掌握 ndarray 高效计算与统计处理方法。

2026.09.21

0

17

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
ThinkPHP配置开发与CMS后台实战
ThinkPHP配置开发与CMS后台实战

共87课时 | 12.4万人学习

第二十三期_综合实战
第二十三期_综合实战

共89课时 | 10.6万人学习

Layui 快速入门精讲
Layui 快速入门精讲

共5课时 | 1.6万人学习