表单输入框的 placeholder 就是水印，直接用 placeholder 属性即可，Layui 完全兼容且不干扰验证；若需斜纹浮层水印，则须用 Canvas 或绝对定位覆盖整个表单容器。
表单输入框的 placeholder 就是水印，别搞复杂了
很多人搜“Layui 表单水印”，其实是想让输入框空着时显示提示文字——这直接用 placeholder 属性就行，Layui 完全兼容，且不干扰验证逻辑。
- 写法：
<input type="text" name="username" placeholder="请输入用户名"> - 它不是“水印”（watermark），但视觉效果和用途一致：浅灰色、仅空时显示、聚焦后消失
- 别用 CSS 伪元素模拟：
::placeholder兼容性差，IE 不支持，移动端部分机型渲染异常 - 不要在
lay-verify规则里动态改placeholder，Layui 不监听该属性变化，改了也不刷新显示
真要加带倾斜/半透明的背景水印？只能覆盖整个表单容器
如果需求是类似“内部使用”“机密”这类斜纹浮层水印，placeholder 搞不定，必须用 Canvas 或绝对定位 DOM 覆盖——但它和表单字段无关，而是作用于整个父容器（比如 .layui-form 或 body）。
- 不能只给某个
<input>加，因为 input 是行内元素，无法承载 canvas 或伪元素水印 - 推荐复用已验证的 canvas 方案：
drawWatermark('内部使用')，传入表单外层容器 ID（如watermarl_element: '#myForm'） - 注意 z-index：水印需高于表单控件，但低于弹窗（如 layer.open），建议设为
z-index: 999 - 响应式下必须监听
resize并重绘，否则窗口缩放后水印错位或消失
别把 label 里的问号图标当成水印
有人把 label 后面加 ? 图标当作“水印提示”，这是常见误解。它本质是辅助说明，不是水印，且容易出问题：
- 点图标会触发
label默认聚焦行为（跳转到关联 input），必须加pointer-events: none或用<span>包裹隔离 - 图标和文字间距要手动控制：
margin-left: 4px，否则紧贴难看 - hover 提示用
title最简，但 IE 对 Unicode 支持差；更稳的是layer.tips('这里是说明', this) - 它不随输入状态变化，和 placeholder 的“动态水印”逻辑完全不同
form.render() 后动态改 placeholder？不行，得换思路
如果业务要求根据用户角色或权限动态切换提示文字（比如管理员看到“请输入工号”，普通用户看到“请输入姓名”），不能靠 JS 修改 placeholder 属性再调 form.render() —— Layui 不重新解析这个属性。
- 正确做法：用原生 DOM 操作直接改
input.placeholder，无需触发 render - 示例：
document.querySelector('[name="username"]').placeholder = '请输入工号'; - 若 input 是异步加载的（如 Ajax 插入），确保 DOM 存在后再操作，避免
querySelector返回 null - 别用
elem.setAttribute('placeholder', ...)，某些旧版浏览器对动态设置 placeholder 支持不稳定
