真正稳定的做法是用 lay-append-to="body" 将 select 下拉挂载到 body 下，配合 lay-append-position="fixed" 防止滚动偏移，仅适用于 select 标签。
直接改 .layui-layer-content 的 overflow 为 visible 能临时见效，但会破坏弹窗滚动逻辑、引发布局错乱，不是可持续方案。真正稳定的做法是让 select 面板脱离弹窗 dom 层级，而不是强行撑开容器。
用 lay-append-to="body" 把下拉挂到 body 下
这是 Layui 2.9.12+ 官方推荐的解法，核心是绕过父容器的定位和溢出限制：
-
lay-append-to="body"强制将下拉 DOM 插入<body>，天然避开 layer 的z-index和overflow干扰 - 必须搭配
lay-append-position="fixed"，否则在滚动页面时下拉层会随文档流偏移 - 仅对
<select>标签生效，不适用于textarea或自定义组件 - 如果弹窗内容是动态加载（如
content: $('#form')），需在success回调里重新渲染：form.render(null, 'myform')
layer 弹窗中仍要改 overflow？小心副作用
老项目或低版本 Layui（
- 只改
.layui-layer-content的overflow: visible最多只治标——它会让弹窗内部所有溢出内容（比如长表格、高图表）全部撑出来，破坏 UI 一致性 - 若弹窗启用了
maxmin: true或设置了area，overflow: visible可能导致拖拽失效或遮挡其他弹窗 - 真要硬改，优先用更精确的选择器：
.layui-layer-page .layui-layer-content，避免误伤type: 2的 iframe 弹窗 - CSS 里加
!important才能覆盖 Layui 内联样式，但会增加后续维护成本
为什么 z-index 调整通常无效
很多人试过给 select 加 z-index 或调低 layer.open({zIndex: 9999})，结果还是被盖住——因为：
- 原生
<select>下拉菜单不参与 CSS 层叠上下文，z-index对它完全无效 - Layui 的下拉面板（
.layui-form-select dl）默认用position: absolute，其层级由最近的position: relative/absolute父容器决定，不是全局 z-index - layer 的
zIndex默认是19891014，而 select 面板计算后的真实层级常低于它，单纯改数字容易踩到边界值（比如设成19891013反而更糟）
表单渲染时机不对会导致 lay-append-to 失效
这个坑很隐蔽：属性写了，DOM 也插入了 body，但下拉依然被截断。常见于以下场景：
- select 是 JS 动态插入弹窗内容区的（比如
layero.find('.layui-form').append('<select ...>')），但没调用form.render() - 弹窗用了
type: 2（iframe），而lay-append-to="body"是在子页面写的，此时body指 iframe 内部的 body，不是主页面 - select 在
v-if或ng-if等框架指令控制下异步显示，Layui 初始化时找不到该元素 - 修复方式统一：确保
form.render()在 select 元素已挂载 DOM 后执行，且作用域明确（如form.render(null, 'layer-form')）
最易被忽略的一点：lay-append-to="body" 在移动端（尤其是 iOS Safari）可能触发全屏原生选择器，此时应检测 layui.device().ios 并降级为 lay-search + 自定义浮层方案。
