layui 日期不能重新渲染

需求:当用户选择开始日期的时候,结束日期要小于开始日期。

遇到的问题:

当切换开始时间时,结束时间的输入框不会被重新渲染。

解决:

html代码:
javascript 复制代码
<div class="layui-form-item">
 <label class="layui-form-label">开始时间</label>
 <div class="layui-input-inline">
   <input type="text" class="layui-input" placeholder="请选择开始时间" id="startTime" name="startTime">
 </div>
</div>

<div class="layui-form-item expireTime" style="display: flex;align-items: center;">
  <label class="layui-form-label">结束时间</label>
  <div class="layui-input-inline" id="endTimeBox">
    <input type="text" class="layui-input" placeholder="请选择结束时间" id="endTime" name="endTime">
  </div>
</div>
js代码:
javascript 复制代码
 let startInitTime = '' // 初始化开始时间
 let endInitTime = '' // 初始化结束时间
 // 开始时间初始渲染
 laydate.render({
   elem: '#startTime'
   ,value: startInitTime,
   done: function(value, date, endDate){ // 更改开始时间后的回调
     // 移除当前的dom元素,重新进行元素的插入
     $('#endInitTime').remove()
     $('#endInitTimeBox').html(`<input type="text" class="layui-input" placeholder="请选择结束时间" id="endTime" name="endTime">`)
     // 重新渲染结束时间
     laydate.render({
       elem: '#endTime',
       min: payDate,
       value //必须遵循format参数设定的格式
     });
     form.render()
   }
 });
 form.render();
相关推荐
Python大数据分析@1 分钟前
我把pdfplumber整成了可以拖拉拽的web软件
前端·pdf
小华同学ai6 分钟前
终于有人帮你整理好了,火爆的“系统级提示词”支持ChatGPT、Claude、Gemini、xAI的
前端·后端·github
葡萄城技术团队9 分钟前
SpreadJS 电子表格权限管控设置指南
前端
HashTang9 分钟前
一个人就是一支队伍:从 Next.js 到显示器,聊聊我的“全栈续航”方案
前端·后端·程序员
朕的剑还未配妥15 分钟前
vue2中transition使用方法解析,包含底部弹窗示例、样式未生效踩坑记录
前端·vue.js
q***484117 分钟前
Redis Desktop Manager(Redis可视化工具)安装及使用详细教程
android·前端·后端
码上成长18 分钟前
组件库提速:Storybook + Chromatic + Visual Test 实战
前端·自动化
灵犀坠27 分钟前
前端核心知识体系梳理:从Vue 3到现代CSS与JavaScript
前端·javascript·vue.js
lcc18729 分钟前
Vue3 新的组件
前端·vue.js
AskHarries31 分钟前
技术人最深的三大痛点:看见的人不多,说出口的人更少
前端·后端·程序员