layDate.js

1.引入layDate.js

2.html <input type="text" id='test1' placeholder="请选择日期"

3.js

<script>
//type 控件选择器  默认值为date
// year 年份选择器 只提供年列表选择
// month（年月选择器）只提供年、月选择
// date（日期选择器）可选择：年、月、日。type默认值，一般可不填
// time （时间选择器）只提供时、分、秒选择
// datetime（日期时间选择器）可选择：年、月、日、时、分、秒
laydate.render({
    elem:'#test1'
    ,type:'date'//默认为date
    ,trigger:'click'//默认为click，即点击后出现日历框
    ,format:"yyyy年MM月dd日"//默认是yyyy-MM-dd
    ,value:2019年08月12日//value格式必须与format格式相同
})
</script>

//trigger-自定义弹出控件事件
//类型：string，默认值：focus，如果绑定的元素非输入框，则默认事件为：click
//lang 语言
//类型：string，默认值：cn  cn/en

laydate.render({
elem:"#test1",
range:"~"//range:"~"来定义
,trigger:"mouseenter"//鼠标伊苏日历出现
,lang:'cn'
})

 

// range - 开启左右面板范围选择,一般默认为false
//当设置为true时，可以选择范围
laydate.render({
  elem: '#test1'
  ,range:'-'//range: '-' 来自定义分割字符
  ,min:-7
  ,max:7
});

 

//mark 标记-可以标出特殊日子，建立备忘录
laydate.render({
elem:"#test1"
,leng:'',
,mark:{
  '0-6-1':'儿童节'
 ,'0-11-11':'光棍节'
}
})

//theme 主题
//类型:string 默认值：default
theme的可选值有：default(默认简约)、molv(墨绿背景)、#颜色值(自定义颜色背景)、grid(格子主题)
laydate.rander({
  elem:'#test1'
,lang:'en'
,theme:'molv'
})