bootstrap 时间控件

来源：互联网发布：淘宝店铺运营方案ppt 编辑：程序博客网时间：2024/05/16 06:09

最近使用了bootstrap的UI感觉确实很漂亮，非常值得学习和使用。下面先简单了解下bootstrap的时间控件。

这个时间控件使用起来还是非常的简单，只需要引入基本的css和js就可以了

需要引入的css和js：（文件引入路径根据自己的项目而定）

<link href="<c:url value='/plugins/bootstrap-datetimepicker/css/datetimepicker.css'/>"rel="stylesheet" type="text/css" /><link href="<c:url value='/plugins/bootstrap/css/bootstrap.min.css'/>" rel="stylesheet" type="text/css"/><script type="text/javascript"src="<c:url value='/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js'/>"></script><script type="text/javascript"src="<c:url value='/plugins/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.fr.js'/>"></script><script src="<c:url value='/plugins/bootstrap/js/bootstrap.min.js'/>" type="text/javascript" ></script><script src="<c:url value='/plugins/jquery-1.10.2.min.js'/>" type="text/javascript"></script>

控件和js的调用：

<input id="startDate" size="16" type="text" >$('#startDate').datetimepicker({format : 'yyyy-mm-dd',weekStart : 1,todayBtn : 1,autoclose : 1,todayHighlight : 1,startView : 2,forceParse : 0,showMeridian : 1,language: 'zh-CN',//汉化minView: "month" //选择日期后，不会再跳转去选择时分秒 });

下面来看看效果图：

插件下载地址：http://download.csdn.net/detail/javaweiming/8140797

4 0