Bootstrap-datetimepicker日期插件简单使用
写在前面:
日期组件有很多,这里简单的记录下bootstrap的一个日期插件datetimepicker，使用方法比较简单，基本上看一些就会了，但是还是记录下。
这个就不过多的说了，简单粗暴上代码
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>datetimpicker测试</title>
<!--图标样式-->
<link rel="stylesheet" type="text/css" href="${baseURL}/Bootstrap/bootstrap/css/bootstrap.min.css" />
<link href="${baseURL}/Bootstrap/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/>
<script src="${baseURL}/Bootstrap/bootstrap/assets/js/jquery-1.10.2.min.js"></script>
<script src="${baseURL}/Bootstrap/bootstrap/assets/js/bootstrap.min.js"></script>
<script src="${baseURL}/Bootstrap/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script src="${baseURL}/Bootstrap/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<style type="text/css">
</style>
</head>
<body>
<div >
<div>
<form method="" action="" >
<label >Date</label>
<input type="text" name="recordDate" />
</form>
</div>
</div>
</body>
<script type="text/javascript">
$(function(){
$("#input_date").datetimepicker({
bootcssVer:3, //bootstrap-datetimepicker＋bootstrap v3，但这个插件使用的时候，并没有和V3相匹配，仍然调用的是bootstrap V2的图标 把bootcssVer的值直接设为3，否则datetimepicker不会显示出上、下个月的箭头
format: \'yyyy-mm-dd\',
minView: \'month\',//设置时间选择为年月日 去掉时分秒选择
todayBtn: true, //如果此值为true 或 "linked"，则在日期时间选择器组件的底部显示一个 "Today" 按钮用以选择当前日期。如果是true的话，"Today" 按钮仅仅将视图转到当天的日期，如果是"linked"，当天日期将会被选中。
language: \'zh-CN\',
autoclose: true, //当选择一个日期之后是否立即关闭此日期时间选择器。
keyboardNavigation: true, //是否允许通过方向键改变日期。
forceParse: true, //当选择器关闭的时候，是否强制解析输入框中的值。
todayHighlight: 1 //如果为true, 高亮当前日期
}).on("click", function () {
//設置可选的最后日期為當前日期
$("#input_date").datetimepicker("setEndDate", getToday())
});
});
//獲取當前日期
function getToday(){
var today = new Date()
var year = today.getFullYear();
var month = today.getMonth() + 1;
var day = today.getDate();
var todayStr = year+"-"+month+"-"+day;
return todayStr;
}
</script>
</html>代码没什么好说的，大概看下就懂了，也写了很多的注释...........
