Layui 日期时间控件

一、制作只选择年、月的时间控件

//年时间控件
function yearLaydate(id) {
    layui.use('laydate', function () {
        var laydate = layui.laydate;

        laydate.render({
            elem: '#'+ id,
            type: 'year',
            showBottom: false, //关闭底部框 去掉取消、确定、清空按钮
            // 选择年份或者月份都会关闭
            change: function (value, date, endDate) { //监听日期被切换
                lay('#' + id).val(value);
                if ($(".layui-laydate").length) {
                    $(".layui-laydate").remove();
                }
            }
        });
    });
}

//月时间控件
function monthLaydate(id) {

    layui.use('laydate', function () {
        var laydate = layui.laydate;
        var end = laydate.render({
            elem: '#' + id, //选择器结束时间
            format: 'MM',
            type: 'month',
            showBottom: false, //关闭底部框 去掉取消、确定、清空按钮
            // 选择年份或者月份都会关闭
            change: function (value, date, endDate) { //监听日期被切换
                lay( '#' + id).val(value);
                if ($(".layui-laydate").length) {
                    $(".layui-laydate").remove();
                }
            },
            //选择月份即选中关闭  年份扔可以左右点击选择
            change: function (value, date, endDate) { //监听日期被切换
                lay( '#' + id).val(value);
                $('.laydate-month-list').on('click', 'li', function () {//利用的事件委托
                    $('.layui-laydate').remove()
                })
            },
            done: function (value, date) {
                start.config.max = {
                    year: value ? date.year : 3099,
                    month: date.month - 1, 
                    date: date.date,
                    hours: 0,
                    minutes: 0,
                    seconds: 0
                }
            }
        });
    });

}

二、效果图