不能只用 maxlength 属性显示字数，因为它仅限制输入且无UI反馈；需手动添加DOM节点并绑定input事件实现实时统计与提示，同时注意字数计算、截断逻辑及样式布局。
为什么不能只用 maxlength 属性显示字数？
因为 maxlength 只限制输入，不提供任何 UI 反馈——用户看不到“还剩多少字”，也不知道自己刚粘贴的 500 字是否被悄悄截断。Layui 自身不自动渲染字数提示，必须手动加 DOM 节点并绑定实时更新逻辑。
监听哪个事件才能覆盖所有输入方式？
必须用 input 事件，不是 keyup、change 或 blur。它能捕获键盘输入、右键粘贴、拖拽文本、中文输入法上屏、甚至自动填充（autofill）等全部场景。实操时注意：
- 事件必须绑定在原生
textarea元素上，别绑到layui-form-item容器 - 如果用了
layui.form.render()，确保绑定写在它之后，否则 DOM 重绘后事件丢失 - 推荐用
layui.$(selector)获取元素，比原生document.querySelector更兼容旧版 IE
怎么把字数提示准确放在右下角？
不能靠绝对定位覆盖，容易错位或被响应式撑开。正确做法是紧贴 textarea 所在的 layui-input-block 或 layui-form-text 内部末尾追加一个 <div>：
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<textarea name="desc" class="layui-textarea"></textarea>
<div class="layui-form-text-count">剩余 200 字</div>
</div>
</div>
CSS 建议这样写，避免换行和跳动：
.layui-form-text-count {
font-size: 12px;
color: #999;
text-align: right;
margin-top: 4px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
字数计算和截断要注意什么？
前端统计“字数”默认按 textarea.value.length 算：中文、英文、空格、换行符（\n）各算 1 字。这个值和用户感知一致，也方便与后端校验对齐。但关键细节是：
- 别用
innerText或textContent，它们对textarea返回空或不可靠值 - 截断必须在
input回调里做：if (val.length > maxLen) { el.value = val.slice(0, maxLen); } - 不要动态设置
el.setAttribute('maxlength', maxLen)，旧版 Safari 不支持运行时生效 - 如果后端要求按 UTF-8 字节数校验（如中文占 3 字节），得用
new TextEncoder().encode(val).length，但显示余量仍建议用字符数，避免用户困惑
中文输入法下标延迟是浏览器标准行为，不用监听 compositionstart，只要确保逻辑在 input 里，上屏后立刻更新即可。真正容易被忽略的是：字数统计必须独立于 form.verify，否则提交前才校验，用户根本不知道哪错了。
