欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

layuiDate 动态设置时间选择范围

程序员文章站 2022-06-07 13:18:52
...

html

<div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">起始日期:</label>
            <div class="layui-input-inline">
                <input type="text" name="startDate" id="startDate"  placeholder="起始日期" class="layui-input" readonly>
            </div>
        </div>
        <div class="layui-inline" style="margin-right: 0">
            <label class="layui-form-label">截止日期:</label>
            <div class="layui-input-inline" style="margin-right: 0">
                <input type="text" name="endDate" id="endDate" placeholder="截止日期" class="layui-input" readonly>
            </div>
        </div>
    </div>

js:

var startDate = laydate.render({
                elem: '#startDate',
                done: function (value, date) {
                    endDate.config.min = {
                        year: date.year,
                        month: date.month - 1,
                        date: date.date,
                    };
                }
            });
var endDate = laydate.render({
                elem: '#endDate',
                done: function (value, date) {
                    startDate.config.max = {
                        year: date.year,
                        month: date.month - 1,
                        date: date.date,
                    }
                }
            });