這里主要舉例說明如何使用年選擇器仙蛉、月選擇器犀概、日選擇器
/**
* css部分代碼
*/
<link rel="stylesheet" type="text/css" href="js/common/UILab/layui2.4.5/css/layui.css" />
/**
* html部分代碼
*/
<input type="text" class="layui-input" id="flow-years" placeholder="yyyy">
<input type="text" class="layui-input" id="flow-year-month" placeholder="yyyy-MM">
<input type="text" class="layui-input" id="flow-year" placeholder="選擇日期">
<input type="text" class="layui-input" id="flow-time-range" placeholder="選擇時間區(qū)間">
/**
* js部分代碼
*/
<script type="text/javascript" src="js/common/UILab/layui2.4.5/layui.js"></script>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//按年查詢
laydate.render({
elem: '#flow-years'
,type: 'year'
,done: function(value, date, endDate){
flowYears = value;
}
});
//按月查詢
laydate.render({
elem: '#flow-year-month'
,type: 'month'
,done: function(value, date, endDate){
flowYearMonth = value;
}
});
//按日查詢
laydate.render({
elem: '#flow-year'
,format: 'yyyy-MM-dd'
,done: function(value, date, endDate){
flowYmd = value;
}
});
//小時-分鐘區(qū)間選擇
laydate.render({
elem: '#flow-time-range'
,type: 'time'
,range: true
,format: 'HH:mm'
,done: function(value, date, endDate){
flowHourminite = value;
}
});
});
</script>