weui.js之datepicker年月日时分秒的选择
常乐
weui.js之datepicker年月日时分秒的选择
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.0.1/weui.min.css">
<script type="text/javascript" src="https://res.wx.qq.com/t/wx_fed/cdn_libs/res/weui/1.2.3/weui.min.js"></script>
</head>
<body>
<script type="text/javascript">
// weui.alert('alert');
// // 示例2：
// weui.datePicker({
// start: 1997, // 从今天开始
// end: new Date(),
// defaultValue: [2020, 6, 9],
// onChange: function(result){
// console.log(result);
// },
// onConfirm: function(result){
// console.log(result);
// },
// id: 'datePicker'
// });
function isWhichTime() {
let years = [];
let mouth =[];
let date = [];
let hours = [];
let minite = [];
let seconds = [];
if(!years.length&&!mouth.length) {
for(let i = 1889; i <= 2030; i++) {
years.push({
label: i +"年" ,
value: i
});
}
}
if (!mouth.length) {
mouth = costomDatePicker(mouth,1,13,"月" )
}
if(!date.length) {
date = costomDatePicker(date,1,32,"日" )
}
if(!hours.length) {
hours=costomDatePicker(hours,0,24,"时")
}
if(!minite.length) {
minite=costomDatePicker(minite,0,60,"分")
}
if(!seconds.length) {
seconds=costomDatePicker(seconds,0,60,"秒")
}
weui.picker(years,mouth,date,hours,minite,seconds,{
//end:2030,
id: new Date(),//让每一个点击弹框得都有一个不一样得id，这样就避免了共用一个弹框得时候，打开得日期是上一次另外一个得日期回显
defaultValue: [new Date().getFullYear(), new Date().getMonth()+1, new Date().getDate(),new Date().getHours(),new Date().getMinutes(),new Date().getSeconds()],
onConfirm: result=> {
//result 是数组，返回得是当前选中得数，如[{lable:'2019年,value:2019},{lable:'2月,value:2}，{lable:'2号,value:2}]
if (result.length){
//yyyy-mm-dd hh:mm:ss
let time=result[0].value+'-'+result[1].value+'-'+result[2].value+' '+result[3].value+':'+result[4].value+':'+result[5].value;
console.log('time',time)
this.el.find(timeSelector).val(time);
}
}
});
}
//自定义日期:月时分秒
function costomDatePicker(years,startTime,endTime,str){
for(let j = startTime; j < endTime; j++) {
years.push({
label: ('' + j).length === 1 ? '0'+j + str : '' + j + str,
value: ('' + j).length === 1 ? '0'+j : '' + j ,
});
}
return years;
};
isWhichTime();
</script>
</body>
</html>
类似资料：