bootstrap-datetimepicker 时间控件的简单实用

1.引包

<link rel="stylesheet" href="../lib/css/conmon.css">

<link rel="stylesheet" href="../lib/css/bootstrap.min.css">

<link rel="stylesheet" href="../lib/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css">

<script src="../lib/js/jquery-2.1.4.min.js"></script>

<script src="../lib/js/bootstrap.min.js"></script>

<script src="../lib/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>

<script src="../lib/bootstrap-datetimepicker/bootstrap-datetimepicker.zh-CN.js"></script>

2 页面结构

<input type="text" value="" > 年月日

<input type="text" value="" >年月

<input type="text" value="" >年

3.调用方法

$(\'#datetimepicker\').datetimepicker({

format:\'yyyy-mm-dd\',

autoclose:true,//自动关闭

minView:2,//最精准的时间选择为日期0-分 1-时 2-日 3-月

weekStart:0,

});

$(\'#datetimepicker1\').datetimepicker({

format:\'yyyy-mm\',

autoclose:true,//自动关闭

minView:3,//最精准的时间选择为日期0-分 1-时 2-日 3-月

weekStart:0,

startView:3,

language:\'zh-CN\'

});

$(\'#datetimepicker2\').datetimepicker({

format:\'yyyy\',

autoclose:true,//自动关闭

minView:4,//最精准的时间选择为日期0-分 1-时 2-日 3-月

weekStart:0,

startView:4

});

简单实用, http://www.cnblogs.com/benyu-aimao/p/4095583.html

使用前切记初始化

$(\'#datetimepicker1\').datetimepicker(\'remove\');