这篇博客介绍了如何利用datepicker-bootstrap插件在网页中创建年月日和时分秒选择器。首先，需要从官网下载js和css文件，然后在页面中应用，设置格式、语言、自动关闭、清除按钮等选项。对于年月日选择，通过on('changeDate')事件处理开始和结束日期的关联。对于时分秒选择，使用datetimepicker并配置相关参数，如分钟步进和结束日期。博客提供了详细的代码示例和链接。
记录一下日期控件，datepicker-bootstrap；这个控件支持年月日以及时分秒。
首先需要到官网下载其js、cs样式
2、页面应用：(支持年月日)
创建时间
至
name="lsc_enddate" placeholder="结束日期" type="text">
$('#lsc_startdate').datepicker({
format : 'yyyy-mm-dd',
language : 'zh-CN',
autoclose : true,
clearBtn : true,
todayHighlight : true,
endDate : new Date()
}).on( 'changeDate', function(e) {
var startTime = e.date;
$('#lsc_enddate').datepicker( 'setStartDate', startTime);
});
$('#lsc_enddate').datepicker({
format : 'yyyy-mm-dd',
language : 'zh-CN',
autoclose : true,
clearBtn : true,
todayHighlight : true
}).on( 'changeDate', function(e) {
var endTime = e.date;
$('#lsc_startdate').datepicker('setEndDate', endTime);
$('#lsc_enddate').datepicker( 'setEndDate', new Date());
});
支持至时分秒：
$('#lj_startdate').datetimepicker({
format: 'yyyy-mm-dd hh:ii:ss',
autoclose: true,
minView: 0,
language : 'zh-CN',
minuteStep:1
}).on('changeDate',function(ev){
var starttime=$("#lj_startdate").val();
$("#lj_enddate").datetimepicker('setStartDate',starttime);
$("#lj_startdate").datetimepicker('hide');
});
$('#lj_enddate').datetimepicker({
format: 'yyyy-mm-dd hh:ii:ss',
autoclose: true,
minView: 0,
language : 'zh-CN',
minuteStep:1
}).on('changeDate',function(ev){
var starttime=$("#lj_startdate").val();
var endtime=$("#lj_enddate").val();
$("#lj_startdate").datetimepicker('setEndDate',endtime);
$("#lj_enddate").datetimepicker('hide');
});
链接：https://blog.youkuaiyun.com/lanyang123456/article/details/52894548
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
