bootstrap datetimepicker时间控件

bootstrap datetimepicker时间控件挺好用的 但是也挺难搞得，第一次接触，搞了一下午，网上的文章都只能参考一下，有的都不能用....

1：先引入包

<!-- js -->
<script src="date/jquery-1.8.3.min.js"></script> 
<script src="date/bootstrap.min.js"></script>  
<script src="date/bootstrap-datetimepicker.min.js"></script>  
<script src="date/bootstrap-datetimepicker.zh-CN.js"></script> 
<!-- css -->
<link href="date/bootstrap.css" rel="stylesheet" />   
<link href="date/bootstrap-datetimepicker.min.css" rel="stylesheet" />  
<!-- 如果想使用时间方向图标的话  需要引入图标 -->

2：写两个input标签

<input type="text" placeholder="开始时间" >
<input type="text" placeholder="结束时间" >

:3：js　，并且添加开始时间不得大于结束时间，结束时间不得小于开始时间

<script type="text/javascript">
$(function(){
        $("#start").datetimepicker({
            format:'yyyy-mm-dd hh:ii:ss',  //格式  如果只有yyyy-mm-dd那就是0000-00-00
            autoclose:true,//选择后是否自动关闭  
            minView:0,//最精准的时间选择为日期  0-分 1-时 2-日 3-月
            language:  'zh-CN', //中文
            weekStart: 1, //一周从星期几开始
            todayBtn:  1,
            autoclose: 1,
            todayHighlight: 1,
            startView: 2,
            forceParse: 0,
           // daysOfWeekDisabled:"1,2,3", //一周的周几不能选 格式为"1,2,3"  数组格式也行
            todayBtn : true,  //在底部是否显示今天
            todayHighlight :false, //今天是否高亮显示
            keyboardNavigation:true, //方向图标改变日期  必须要有img文件夹 里面存放图标
            showMeridian:false,  //是否出现 上下午
            initialDate:new Date()
                //startDate: "2017-01-01" //日期开始时间 也可以是new Date()只能选择以后的时间
        }).on("changeDate",function(){
                var start = $("#start").val();
        $("#end").datetimepicker("setStartDate",start);
    });  
        $("#end").datetimepicker({
            format:'yyyy-mm-dd hh:ii:ss',  //格式  如果只有yyyy-mm-dd那就是0000-00-00
            autoclose:true,//选择后是否自动关闭  
            minView:0,//最精准的时间选择为日期  0-分 1-时 2-日 3-月
            language:  'zh-CN', //中文
            weekStart: 1, //一周从星期几开始
            todayBtn:  1,
            autoclose: 1,
            todayHighlight: 1,
            startView: 2,
            forceParse: 0,
            //daysOfWeekDisabled:"1,2,3", //一周的周几不能选
            todayBtn : true,  //在底部是否显示今天
            todayHighlight :false, //今天是否高亮显示
            keyboardNavigation:true, //方向图标改变日期  必须要有img文件夹 里面存放图标
            showMeridian:false  //是否出现 上下午
           // startDate: "2017-01-01"  //开始时间  ENdDate 结束时间
        }).on("changeDate",function(){
                var end = $("#end").val();
        $("#start").datetimepicker("setEndDate",end);
    });    
});
</script>