【laydate】layUI-laydate计算时间差

输入起始时间、结束时间，自动计算时间差，生成持续时间

起始时间不能晚于结束时间
结束时间不能早于开始时间

 <div class="layui-row masterMeter"><label class="textLabel">结束时间</label><div class="layui-col-xs12 selectInput"><input id="jssj" name="m:djmsqkjlb:jssj" class="layui-input textInput magicalcoder-laydate" type="text" placeholder="请选择日期" maxlength="0" format="yyyy-MM-dd HH:mm:ss" datetype="datetime" mc-attr-str-type="datetime" autocomplete="off"/></div></div><div class="layui-row masterMeter"><label class="textLabel">持续时间</label><div class="layui-col-xs12 selectInput"><input name="m:djmsqkjlb:cxsj" class="layui-input textInput" type="text" maxlength="50" placeholder="请输入持续时间" autocomplete="off"/></div></div><div class="layui-row masterMeter"><label class="textLabel">记录添加时间</label><div class="layui-col-xs12 selectInput"><input name="m:djmsqkjlb:jltjsj" class="layui-input textInput magicalcoder-laydate" type="text" value="2022/9/13" placeholder="请选择日期" maxlength="0" format="yyyy-MM-dd HH:mm:ss" datetype="datetime" mc-attr-str-type="datetime" autocomplete="off"/></div></div>

layui.use(['laydate', 'form'], function(){var laydate = layui.laydate;var d1 = '';var d2 = '';// 自动计算时间差function changeTime() {if (d1 && d2) {//开始时间//   var date1 = new Date(d1).getTime();  火狐浏览器46版本报NaN//   var date2 = new Date(d2).getTime();var date3 = d2 - d1;   //时间差的毫秒数//计算出相差天数var days = Math.floor(date3 / (24 * 3600 * 1000))//计算出小时数var leave1 = date3 % (24 * 3600 * 1000)    //计算天数后剩余的毫秒数var hours = Math.floor(leave1 / (3600 * 1000))//计算相差分钟数var leave2 = leave1 % (3600 * 1000)        //计算小时数后剩余的毫秒数var minutes = Math.floor(leave2 / (60 * 1000))//计算相差秒数var leave3 = leave2 % (60 * 1000)      //计算分钟数后剩余的毫秒数var seconds = Math.round(leave3 / 1000)//   console.log(days + "天 " + hours + "小时 " + minutes + "分钟 " + seconds + "秒");$('[name="m:djmsqkjlb:cxsj"]').val(days + "天 " + hours + "小时 " + minutes + "分钟 " + seconds + "秒");} else {$('[name="m:djmsqkjlb:cxsj"]').val("");}}var start = laydate.render({elem: '#qssj',type: 'datetime',done: function(value, date, endDate){if(value) {var start_date = new Date(date.year, date.month, date.date, date.hours, date.minutes, date.seconds);d1 = start_date.getTime();} else {  // 点击清空按钮触发清空d1 = '';}changeTime();end.config.min = date; //最大时间为结束时间的开始值end.config.min.month = date.month - 1;}});var end = laydate.render({elem: '#jssj',type: 'datetime',done: function(value, date, endDate){if(value) {var end_date = new Date(date.year, date.month, date.date, date.hours, date.minutes, date.seconds);d2 = end_date.getTime();} else {// 点击清空按钮触发清空d2 = '';}changeTime();start.config.max = date; //最小时间为开始时间的最大值 start.config.max.month = date.month - 1;}});
});

【laydate】layUI-laydate计算时间差相关推荐

layUI laydate 时间选择器近一天、近一月、近三月、近一年
参考其他博主代码的情况下进行改编写入时间组件 <input type="text" class="layui-input" id="dateI ...
layui 日期重置_日期时间插件--日期时间组件文档 - layui.laydate
样式: /*这里我引的是我本地的js*/ layui.use('laydate', function () { var laydate = layui.laydate; var start = { / ...
layui.laydate默认当前时间时分秒
layui.laydate默认当前时间时分秒代码如下代码如下 //加载日期控件信息layui.use('laydate', function() {var laydate = layui.layd ...
layui layDate时间控件绑定多个文本框组件
layDate.js下载地址多个输入框都是实现选择日期时间,通过class去循环遍历绑定时间控件. <div><input type="text" class= ...
layui laydate 渲染失效问题，lay-key导致动态生成代码二次渲染失败
在开发中因为需要动态生成时间选择框,所以选择了layui的 laydate控件,但是遇到了生成的时间选择框点击无效的问题,然后再次render 时间选择器一闪就消失了,查了多方资料,找到了如下的解决方 ...
layui laydate 自定义mark
layui laydate 自行定义mark 在日历上标注区别签到过和未签到过的,效果如图: 要写个日历的,最后选择了layui上面的laydate日期和时间组件,我的需求上面不需要选择日期啥的,和日 ...
jQuery学习：日期控件 layui -laydate
layDate - JS日期与时间组件/日历插件 (layuiweb.com) 下载文件显示时间 <!DOCTYPE html> <html><head>< ...
php获取laydate,解决laydate时间日期插件定位溢出
laydate是一款比较好用的网页时间日期插件,不过用起来有一些细节问题需要我们手动去解决!例如:laydate兼容bootstrap 1. 默认情况 laydate弹出层默认对齐input左边框 2 ...
R语言difftime函数计算时间差值实战
R语言difftime函数计算时间差值实战目录 R语言difftime函数计算时间差值实战 #基础语法 #获取difftime语法帮助

【laydate】layUI-laydate计算时间差

输入起始时间、结束时间，自动计算时间差，生成持续时间

【laydate】layUI-laydate计算时间差相关推荐

最新文章

热门文章