laydate时间控件默认选中年月+多个laydate控件的动态最大最小值

最新推荐文章于 2023-11-07 11:39:15 发布

原创

最新推荐文章于 2023-11-07 11:39:15 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了如何在laydate时间选择控件中实现默认选中年月，并根据条件动态设置最大最小日期。当学期为空时，时间选择不受限制；若选择了特定年份的学期，日历将默认展示该年份的1月。通过使用页面ID和控件class生成laydate实例，便于后期维护和调整最大最小日期限制。

后台使用的mel的模版

学期为空不限制时间；如果选中了2020年的学期，那么日历头部就是2020年1月

页面在js控制，我的步骤

//初始化时候找到要用的组件
lay(moduleId + ' .nyr ').each(function(){
    let _this = this,
        str = _this.className,
        index = str .lastIndexOf("\ ");
    str  = str .substring(index + 1, str .length);
    console.log(this)
    if(str == "startTime"){
        $(moduleId + ' .'+str).attr('id', "startTime");
    }else {
        $(moduleId + ' .'+str).attr('id', "endTime");
    }
});

使用的页面id配合控件的class来生成的，这样做的目的是更好的在后续修改最大最小值；

//初始化时间控件
var start_opt = {
    elem : '#startTime',
    type : 'date',
    isInitValue: false,
    value:"2020-01-01",
    format : 'yyyy-MM-dd',
    show : true,
    done:function(value){
        const start = new Date(new Date(new Date(value).toLocaleDateString()).getTime());
        $("#form-safety-

最低0.47元/天解锁文章