本文详解如何通过原生 javascript 动态设置退房日期为入住日期的第二天，兼容 wordpress 短代码环境，无需 jquery 依赖，修复常见 dom 操作与日期计算错误。
在酒店预订表单中，让“退房日期”默认比“入住日期”晚一天，是提升用户体验的关键细节。但直接拼接字符串（如 "indate + 1"）或误用 DOM 方法（如 setElementById）会导致脚本失效——这正是原始代码失败的根本原因：document.setElementById 并不存在，且日期加减必须基于 Date 对象运算，而非字符串操作。
以下为纯原生、零依赖、WordPress 友好的解决方案：
✅ 正确实现步骤
- 确保 HTML 结构规范：为两个日期输入框设置唯一 id，并移除无效的 type="date/javascript"（应为 text/javascript 或省略）；
- 监听入住日期变更：使用 input 或 change 事件实时响应用户选择；
- 安全计算次日日期：将字符串日期转为 Date 对象，setDate(getDate() + 1)，再格式化为 YYYY-MM-DD；
- 设置退房日期值：仅当入住日期有效时才更新，避免空值或非法日期导致异常。
✅ 完整可运行代码（适配 WordPress 短代码）
⚠️ 注意事项（WordPress 环境特别提示）
- 脚本位置：将
- 短代码兼容性：WordPress 默认可能过滤
- 浏览器兼容性： 在 Safari 旧版本中支持有限，生产环境建议搭配轻量级日期库（如 flatpickr）增强兼容性；
- 用户体验优化：可为退房日期添加 min 属性（checkOut.min = checkIn.value），防止用户手动选择早于入住的日期。
该方案简洁、健壮、无第三方依赖，完美解决原始代码中的语法错误、逻辑缺陷与执行时机问题，可直接集成至 WordPress 短代码小工具中稳定运行。
