实现layui日期控件laydate对开始和结束时间的联动

1.页面先引入layui.js和jquery.js文件

2.html页面如下：

<div class="hour_type mg-top">
                <ul class="mui-table-view">
                    <li class="mui-table-view-cell">
                        <div class="left-style">
                            <label style="color: red;">*</label>
                            <label>开始时间</label>
                        </div>
                        <div class="right-style">
                            <input placeholder="请选择" id="timeStart" />
                            <img src="../img/arrow-lower.png" />
                        </div>
                    </li>
                    <li class="mui-table-view-cell">
                        <div class="left-style">
                            <label style="color: red;">*</label>
                            <label class="laber-style">结束时间</label>
                        </div>
                        <div class="right-style" id="end">
                            <input placeholder="请选择" id="timeEnd" />
                            <img src="../img/arrow-lower.png" />
                        </div>
                    </li>
                </ul>
            </div>

 

3.js如下：

layui.use('laydate', function() {  var startDate = layui.laydate.render({ elem: '#timeStart', done: function(value, date) { var year = date.year; var month = date.month - 1;//月份需要减一才是正确值 var day = date.date; var finalDate = new Date(year, month, day);//获取开始时间的年月日 console.log(finalDate.valueOf()); $('#timeStart').click(function() {//每次改变日期就重新赋值 $('#timeEnd').remove(); }) $('#end').html('<input placeholder="请选择" id="timeEnd" /><img src="../img/arrow-lower.png" />') var endDate = layui.laydate.render({ elem: '#timeEnd', btns: ['clear', 'confirm'], min: date.year + '-' + date.month + '-' + date.date, max: finalDate.valueOf() + 24 * 60 * 60 * 1000 * 4,//使用时间戳格式 done: function(value, date) { } }); } }); })