laydate 的 change 回调中需手动移除弹窗 DOM 以实现“点击即关”：更新输入框值后执行 $('.layui-laydate').remove()，并配合 showBottom: false；year/month 类型下需额外监听 .laydate-year-list li 点击事件触发关闭。
laydate.render 的 change 回调里手动移除弹窗 DOM
laydate 默认选中日期后不会自动关闭弹窗，尤其在 type: 'year' 或 type: 'month' 场景下，用户点完年份/月份还得再点「确定」——这是最常被吐槽的体验问题。根本原因是 laydate 没有内置「单击即提交并关闭」逻辑，得靠回调 + dom 操作补足。
核心做法是在 change 回调中更新输入框值，并立刻删掉浮层容器：$('.layui-laydate').remove()。注意不是 $('#layui-laydate4') 这类带序号的 ID（它不稳定、不可预测），而是统一用类名选择器。
-
change触发时机是「任意日期单元格被点击切换时」，包括左右年份切换，所以它比done更早、更灵敏 - 务必搭配
showBottom: false，否则底部「清空」「确定」按钮会干扰点击流，且按钮区域不响应change - 不要在
choose回调里做这事——choose只在最终点击「确定」或回车时触发，达不到「点击即关」效果
为什么不能只靠 trigger: 'click' 或 show: false
trigger: 'click' 只控制弹窗怎么唤起（比如改成 focus），和关闭无关；show: false 是初始化时禁用自动弹出，反而会让控件完全不显示。这两个配置对「选中后关闭」没任何作用，纯属常见误解。
真正影响关闭行为的是回调时机 + 主动 DOM 清理。另外，如果页面存在多个 laydate 实例，$('.layui-laydate') 会匹配全部，但实际只会有一个处于打开状态，所以安全；若想更精确，可用 $(this.elem).closest('.layui-laydate')，不过多数场景没必要。
type 为 year/month 时的特殊处理
年份/月份选择器的列表项（如 .laydate-year-list li）默认不触发 change，除非你点的是已高亮的当前年/月。这是 laydate 的一个隐藏限制：只有「值真正变化了」才会进 change。
解决办法是监听列表点击事件，在里面手动触发关闭：
laydate.render({
elem: '#yearInput',
type: 'year',
showBottom: false,
change: function(value) {
$('#yearInput').val(value);
$('.layui-laydate').remove();
}
});
// 补监听：年份列表点击也立即关闭
$('.laydate-year-list').on('click', 'li', function() {
$('.layui-laydate').remove();
});
- 这段监听必须放在
laydate.render()之后，且确保 DOM 已渲染（可包在setTimeout或用事件委托） -
.laydate-year-list和.laydate-month-list是内部类名，虽未公开但长期稳定，可放心用 - 避免重复绑定：每次 render 前先
$('.laydate-year-list').off('click')，否则会越绑越多
兼容性与潜在风险点
直接 $('.layui-laydate').remove() 在大多数项目里没问题，但要注意两个边界情况：
- 如果页面用了
layer.open()等其他 layer 组件，它们共享.layui-laydate类名，可能误删——此时应限定父级：$('.layui-laydate').filter(':visible').first().remove() - 在 Vue/React 等框架里操作 DOM 容易引发状态不同步，建议封装成指令或自定义 Hook，而不是裸写 jQuery
- laydate v2.6+ 加入了
ready回调，可用于确保 DOM 渲染完成后再绑定列表事件，比盲目setTimeout更可靠
最麻烦的其实是「多实例嵌套」场景：比如表格行内每个单元格都有一个年份选择器，渲染时机错乱会导致事件监听失效或删错浮层——这种时候别硬扛，改用 position: 'absolute' + 手动管理显隐更可控。
