html时间选择器时分秒,原⽣js⽇历⽇期控件带时分秒⽇期选择
特效描述:原⽣js⽇历⽇期 时分秒⽇期选择器。时分秒⽇期选择
代码结构
1. 引⼊JS
2. HTML代码
【注意事项】
⼀、请千万勿移动laydate中的⽬录结构,它们具有完整的依赖体系。使⽤时,只需引⼊laydate/laydate.js即可。
⼆、如果您的⽹站的js采⽤合并或模块加载,您需要打开laydate.js,修改path。
演⽰⼆(普通模式)
原生js和js的区别演⽰⼀(⽇期精确到秒)
演⽰三(⽇期范围限制)
开始⽇:
结束⽇:
演⽰四(⾃定义⽇期格式)
演⽰五(⽇期范围限定在昨天到明天)
演⽰六(按钮触发⽇期)
!function(){
laydate.skin('molv');//切换⽪肤,请查看skins下⾯⽪肤库
laydate({elem: '#demo'});//绑定元素
}();
//⽇期范围限制
var start = {
elem: '#start',
format: 'YYYY-MM-DD',
min: w(), //设定最⼩⽇期为当前⽇期
max: '2099-06-16', //最⼤⽇期
istime: true,
istoday: false,
choose: function(datas){
end.min = datas; //开始⽇选好后,重置结束⽇的最⼩⽇期
end.start = datas //将结束⽇的初始值设定为开始⽇
}
};
var end = {
elem: '#end',
format: 'YYYY-MM-DD',
min: w(),
max: '2099-06-16',
istime: true,
istoday: false,
choose: function(datas){
start.max = datas; //结束⽇选好后,充值开始⽇的最⼤⽇期
}
};
laydate(start);
laydate(end);
//⾃定义⽇期格式
laydate({
elem: '#test1',
format: 'YYYY年MM⽉DD⽇',
festival: true, //显⽰节⽇
choose: function(datas){ //选择⽇期完毕的回调
alert('得到:'+datas);
}
});
//⽇期范围限定在昨天到明天
laydate({
elem: '#hello3',
min: w(-1), //-1代表昨天,-2代表前天,以此类推max: w(+1) //+1代表明天,+2代表后天,以此类推});