layui select 下拉框宽度不随窗口缩放，因其默认仅初始化时计算宽度且不监听 resize；需手动监听 window.resize 并动态设置 .layui-select-dropdown 的 style.width，同时确保父容器宽度明确、避免布局干扰，并在移动端增加 orientationchange 监听与键盘弹出防抖校验。
layui select 下拉框宽度不随窗口缩放？根本没监听 resize
layui 的 .layui-form-select 默认不响应窗口尺寸变化，它只在初始化时计算一次下拉面板（.layui-select-dropdown）的宽度，之后就完全静态。你拖动浏览器边框，下拉框不会变宽——这不是 bug，是设计如此。
要让它“自适应”，必须手动监听 window.resize，并在回调里重新设置下拉面板的 width 样式。但注意：不能直接改 .layui-select-dropdown 的 width，因为该元素是动态创建、随时销毁的，得在每次展开时注入逻辑。
- 最稳妥的做法是在
layer.open或表单渲染后，用事件委托监听click到.layui-form-select，然后对刚生成的.layui-select-dropdown设置宽度 - 更轻量的方式是监听
resize后，用setTimeout延迟 10ms 查询是否存在已展开的.layui-select-dropdown，有则重设width: '100%' - 别用
!important硬覆盖，优先通过 JS 动态写style.width，避免和 layui 内部样式冲突
为什么 .layui-select-dropdown 设置 width: 100% 没用？容器没撑开
即使你给 .layui-select-dropdown 加了 width: 100%，它实际宽度仍可能卡在 200px 左右——因为它的父级 .layui-form-select 没有明确宽度，而 layui 默认让 select 容器宽度由内容决定（比如最长 option 文字），不是 100% 占满父容器。
解决路径分两步：
- 确保 select 所在的
.layui-input-block或直接父容器设置了width: 100%，且无float、display: inline-block等干扰布局的样式 - 在 JS 中获取该父容器的
getBoundingClientRect().width，再赋给.layui-select-dropdown的style.width，比百分比更可靠（尤其在 flex 布局中） - 移动端还要额外监听
orientationchange，横竖屏切换时resize不一定触发
固定宽度 vs 百分比：选哪个？看场景
直接写 width: '90%' 看似简单，但在以下情况会失效：
- select 在弹层（
layer.open）里，弹层本身宽度是动态计算的，百分比基于视口而非弹层容器 - 用了
fixed: true的 layer，其内部 DOM 脱离文档流，.layui-select-dropdown的父级宽度计算异常 - 某些老版本 Layui（如 2.5.x）对百分比解析不一致，建议统一用 JS 计算像素值
推荐做法：用 document.getElementById('your-select-container').offsetWidth 获取真实可用宽度，减去左右 padding（通常 12px × 2），再设为下拉框宽度。
移动端键盘弹出导致下拉框错位？必须加防抖 + 尺寸校验
在 iOS/Android 上，软键盘弹出会触发 resize，但此时视口高度剧变，.layui-select-dropdown 的定位可能漂移到屏幕外，甚至被截断。单纯监听 resize 不够。
- 给 resize 处理加 100ms 防抖，避免高频重绘卡顿
- 每次设置前先校验
.layui-select-dropdown是否在 DOM 中：document.body.contains(dropdownEl) - 设置完宽度后，手动调用
dropdownEl.style.left = '0'并检查getBoundingClientRect().right是否超出视口，超了就强制 right 对齐 - 若下拉框内容区（
dl）内文字过长，加white-space: pre-wrap和max-width: 90%防止撑破容器
真正难的不是设宽度，而是判断“什么时候该设”——下拉框存在、容器尺寸可信、页面未被键盘挤压变形，这三个条件缺一不可。
