layui select 的 placeholder 本质是 value="" 的首项 option，而非原生 placeholder 属性；必须用空值 option 作为占位项，动态操作后需调用 form.render() 重绘，css 覆盖或状态错乱时可改用绝对定位模拟。
layui select 的 placeholder 为什么根本没出现
原生 <select></select> 标签不支持 placeholder 属性，Layui 也从未实现过这个语义——它只认 <option value="">请选择</option> 这种“伪 placeholder”模式。如果你写了 placeholder="请选择" 直接加在 <select></select> 上，浏览器会忽略，Layui 也不会读取或渲染它。
常见错误写法：
<select name="city" placeholder="请选择城市"></select>
这种写法完全无效，且容易让人误以为是配置漏了。
- 必须用空值
<option value="">请选择城市</option>作为首项 - 该
<option></option>的value必须严格为空字符串（不能是空格、" "或"null"） - 如果后续动态清空再重填
<option></option>，必须确保第一项仍是value=""的占位项
动态填充后 placeholder 消失或下拉无内容
你 Ajax 拿到数据、.empty() 清空、再 .append() 插入新 <option></option>，结果下拉框点开是空的，或者“请选择”不见了——这不是 placeholder 被覆盖，而是 Layui 没重绘。
Layui 不监听 DOM 变更，<select></select> 结构变了，UI 却还停在初始化那一刻。
- 清空后插入新
<option></option>时，第一项必须是<option value="">请选择xxx</option> - 插入完成后**立即**调用
form.render("select", "yourFormFilter")（第二个参数推荐带上，避免全局重绘） - 别用
.html("")清空，某些版本会破坏 Layui 封装结构；用.empty()或.children().remove() - 检查控制台是否报
form is not defined：确保所有操作都在layui.use(["form"], callback)内执行
用了自定义 skin 或 CSS 后 placeholder 文字看不见
明明 DOM 里有 <option value="">请选择</option>，下拉展开也能看到那行字，但默认状态下它不显示——问题出在 Layui 的样式覆盖逻辑上。
当 <select></select> 未选中任何有效项（即当前 value 为空）时，Layui 会把下拉面板的“已选文本”区域设为透明或浅灰，同时隐藏首项的视觉反馈。
- 检查 .layui-select-title 元素的 color 和 opacity，它可能被全局 CSS 设成了
color: transparent或opacity: 0.3 - 如果用了自定义 skin，确认其 CSS 是否重写了
.layui-select-title .layui-select-label的显示逻辑 - 临时调试：在控制台手动给
.layui-select-title加color: #666 !important，看文字是否浮现 - 更稳方案：放弃依赖首项占位，改用绝对定位模拟 placeholder（见下一条）
不想拼空 option？用绝对定位盖一个 placeholder
当项目要求“初始不显示任何可选项”，连 <option value=""></option> 都不能存在时，Layui 原生机制就走不通了。这时最可控的方式是绕过它，自己画一个。
HTML 结构示例：
<div class="layui-input-block" id="area-select"> <div class="select-placeholder">请选择所属区域</div> <select name="area" lay-filter="area"></select> </div>
CSS 关键点：
#area-select { position: relative; }-
.select-placeholder设position: absolute、pointer-events: none、color: #999 - 选中后通过 JS 显示/隐藏该 div（例如监听
form.on("select(area)", ...)）
这个方案不依赖 Layui 对空 <option></option> 的识别逻辑，也不怕 CSS 覆盖，适合对 UI 控制要求高或需要统一 placeholder 行为的场景。
真正难的不是加文字，而是判断“什么时候该显示、什么时候该隐藏”——尤其在省市联动、异步加载、表单重置等复合场景下，placeholder 状态容易和真实 value 脱节。动手前先理清状态流转，比堆 CSS 更重要。
