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();
相关推荐
四瓣纸鹤1 分钟前
F2图表在Vue3中的使用方法
前端·javascript·vue.js·antv/f2
それども7 分钟前
浏览器CSR和SSR渲染区别
javascript·lua
web前端1238 分钟前
# @shopify/react-native-skia 完整指南
前端·css
shanLion8 分钟前
从 iframe 到 Shadow DOM:一次关于「隔离」的前端边界思考
前端·javascript
精神状态良好11 分钟前
RAG 是什么?如何让大模型基于文档作答
前端
CRAB11 分钟前
解锁移动端H5调试:Eruda & VConsole 实战指南
前端·debug·webview
OpenTiny社区11 分钟前
Vue2/Vue3 迁移头秃?Renderless 架构让组件 “无缝穿梭”
前端·javascript·vue.js
敲代码的独角兽12 分钟前
深入理解 JavaScript 异步机制:从回调到 Promise 再到 async/await
前端
鱼鱼块12 分钟前
二叉搜索树:让数据在有序中生长的智慧之树
javascript·数据结构·面试
敲代码的独角兽12 分钟前
当 Web Worker 遇上异步,如何突破单线程限制?
javascript