本文详细介绍layui laydate日期组件的三种核心回调:ready在控件打开时触发,返回初始日期对象;change在年月日切换时触发,返回生成值及日期对象;done在点击确定或清空时触发,同样返回相关参数。结合代码示例解析各回调的使用场景与参数含义。
控件初始打开回调 ready
当日期控件初次打开时,会触发 ready 回调。该回调接收一个参数,即初始的日期时间对象,包含年、月、日等属性。
ready 回调代码示例
laydate.render({
elem: '#test'
,ready: function(date){
console.log(date); //得到初始的日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
}
});日期切换回调 change
在用户切换年、月或日时,会触发 change 回调。此回调返回三个参数:生成的日期字符串、当前的日期时间对象,以及结束日期时间对象(仅在开启范围选择时有效)。
change 回调代码示例
laydate.render({
elem: '#test'
,change: function(value, date, endDate){
console.log(value); //得到日期生成的值,如:2017-08-18
console.log(date); //得到日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
console.log(endDate); //得结束的日期时间对象,开启范围选择(range: true)才会返回。对象成员同上。
}
});选择完成回调 done
当用户完成选择操作,包括点击具体日期、清空内容、点击“现在”或“确定”按钮时,会触发 done 回调。该回调同样返回三个参数:生成的日期字符串、日期时间对象以及结束日期时间对象(开启范围选择时返回)。
done 回调代码示例
laydate.render({
elem: '#test'
,done: function(value, date, endDate){
console.log(value); //得到日期生成的值,如:2017-08-18
console.log(date); //得到日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
console.log(endDate); //得结束的日期时间对象,开启范围选择(range: true)才会返回。对象成员同上。
}
});总结
以上就是关于layui laydate时间选择器回调方法的详细解析。如需了解更多相关回调内容,建议查阅本站过往文章或继续浏览后续教程,感谢支持。