bootstrap的日期时间插件

 

效果图展示：

1）html代码

<div class="row">
    <div class="col-xs-2">
        <label class="control-label">发布截止日期：</label>
    </div>
    <div class="col-xs-4 updateP1">
        <input type="text" id="abortDate" name="abortDate" class="form-control" value="">
    </div>
</div>

2）需要依赖static/bootstrap-3.3.7-dist/datepicker

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static
/bootstrap-3.3.7-dist/datepicker/css/bootstrap-datetimepicker.min.css" />

<script src="${pageContext.request.contextPath}/static/bootstrap-3.3.7-dist/datepicker
/js/bootstrap-datetimepicker.min.js"></script>

<script src="${pageContext.request.contextPath}/static/bootstrap-3.3.7-dist/datepicker
/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>

3）js调用datetimepicker方法

<script> 
    //时间函数
    function getCurrDate(){
        var d = new Date();
        return d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate()+" "
        +d.getHours()+":"+d.getMinutes()+":"+d.getSeconds();
    }
    //入口函数
    $(function(){
        //时间插件
        $("#abortDate").datetimepicker({
           language:"zh-CN",//汉化
           todayBtn:1,//返回当前时间的button
           format:"yyyy-mm-dd hh:ii:ss",//显示时间的格式
            //minView:"month"//只显示月历
        });
        //时间val值,获取当前时间
        $("#abortDate").val(getCurrDate());
    });
</script> 

就可以啦！