bootstrap 时间控件
近期使用了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" //选择日期后,不会再跳转去选择时分秒
});
以下来看看效果图:
bootstrap 时间控件的更多相关文章
- angularjs 整合bootstrap 时间控件
一.引入js <link href="${basePath}/static/plugin/bootstrap/css/bootstrap-datetimepicker.min.css& ...
- Bootstrap 时间控件datetimepicker与timepicker
一.datetimepicker 首先,我们看看点击选择时间的时候的展示页面吧 年 月 ...
- bootstrap 时间控件带(时分秒)选择器
1.控件下载地址:http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm,参数设置说明也在这个链接下面: 2.具体参数说明(复制原链接) ...
- bootstrap 时间控件带(时分秒)选择器(需要修改才能显示,请按照参数说明后面的步骤进行修改)
1.控件下载地址:http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm,参数设置说明也在这个链接下面: 2.具体参数说明(复制原链接) ...
- Bootstrap时间控件常用配置项
1.给下面4个文本框初始化 $(function(){ $("#orderStartTime,#orderEndTime,#preSaleStartTime,#preSaleEndTim ...
- Bootstrap中时间(时间控件)的设计
运用bootstrap的时间控件,生成时间选择器. 1.截图:有以下这些样式 10年视图 年视图 月视图 日视图 小时视图 2.视图设计: ...
- BootStrap母版页布局.子页面布局.BootstrapTable.模态框.警告框.html导出tabl生成Excel.HTML生成柱图.饼图.时间控件中文版
如上就是很多后台管理系统的母版页布局. 左边一列模板.上面一列系统标识. 空白处充填子页面 以ASP.NET MVC为基础 引入bootstrap.js.bootstrap.css body: < ...
- bootstrap的时间控件使用(双日历)
这段时间看了下bootstrap的时间控件,发现使用起来还是很简单的,趁着有时间的时候整理了一下,方便自己以后忘记的时候查阅... 废话不多说先上效果图 接下来是代码实现 第一步当然是导入css.js ...
- bootstrap日期控件在火狐下的模态框中选择时间下拉菜单无效的解决办法
今天收到程序组提交的一个兼容BUG,在火狐中使用模态框加载日期控件时选择时间下拉菜单没有效果(不能点击),而在谷歌中却是好的, 排错思路:1,在当前页面主层放置一个时间控件,测试通过 2,在ajax加 ...
随机推荐
- 一起来学SpringBoot(十七)优雅的参数校验
参数校验在开发中经常需要写一些字段校验的代码,比如字段非空,字段长度限制,邮箱格式验证等等,写这些与业务逻辑关系不大的代码个人感觉有两个麻烦: 验证代码繁琐,重复劳动方法内代码显得冗长每次要看哪些参数 ...
- Java SE、Java EE、Java ME 三者区别
现在一个个来分析 1. Java SE(Java Platform,Standard Edition).Java SE 以前称为 J2SE.它允许开发和部署在桌面.服务器.嵌入式环境和实时环境中使用的 ...
- C3P0连接池参数配置说明
C3P0连接池参数配置说明 created by cjk on 2017.8.15 常用配置 initialPoolSize:连接池初始化时创建的连接数,default : 3(建议使用) minPo ...
- getDate() 获取时间 如2018年09月21日 11:32:11
function p(s) { return s < 10 ? '0' + s: s;} function getDate() { var myDate = new Date(); //获取当前 ...
- Groovy常用语法汇总
基本语法 1.Grovvy的注释分为//和/**/和java的一样. 2.Grovvy语法可以不已分号结尾. 3.单引号,里面的内容严格的对应java中的String,不对$符号进行转义. def s ...
- sed输出指定行
and line ,8p to line ,8p -e 20p - and line -n:取消默认输出.注意:sed命令会默认把输入行打印到屏幕上,所以如果想精准的控制输出,就需要-n. -e:进行 ...
- 集训第四周(高效算法设计)B题 (二分查找优化题)
---恢复内容开始--- Description Before the invention of book-printing, it was very hard to make a copy of ...
- UVA 227 周期串
题意: 给一个字符串,寻找最短的循环节 如abcabcabcabc以3为周期,也按6和12为周期. 分析: 因为循环节肯定是相等的,所以枚举串长度的所有约数的循环节再判断是否相等即可. 我的方法是枚举 ...
- hihoCoder#1077 RMQ问题再临-线段树
原题地址 终于做到线段树的题了,因为建树.更新.查询都是递归操作,所以其实挺好写的. 用数组存的树,记得MAX_NODE开成两倍叶节点数大小,否则RE啊..不要问我是怎么知道的. 代码: #inclu ...
- android开发里跳过的坑——android studio 错误Error:Execution failed for task ':processDebugManifest'. > Manifest merger failed with multiple errors, see logs
使用AS在gradle里配置了多个定制版本,发现在编译版本切换时,会出现错误: Error:Execution failed for task ':processDebugManifest'.> ...