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加 ...
随机推荐
- python3安装opencv及电子书籍(百度云)
不能直接 pip install opencv 正解: pip install opencv-python 记得:请确保网络良好!!!!! (1)这个是我学习的电子书籍:opencv-python ...
- js 零散知识
# 同一种类型的事件注册多个事件句柄,后面的不会覆盖前面的事件 # event.which == 13,13代表回车 # parsley.js验证框架 # JSON.stringify, avoid ...
- windows sdk编程为应用程序添加图标
#include <windows.h> /*消息处理函数声明*/ HRESULT CALLBACK WindowProc(HWND hwnd, UINT message, WPARAM ...
- dedecms部分文章出现读取附加信息出错的解决办法
问题: 估计是新版本开发的时候,没有考虑旧版,文章内容为空的新闻,新版不在允许文章内容为空的新闻,这样旧版的内容为空的新闻升级后将无法再编辑. 解决:你可以对如下文件进行如下修改:article_ed ...
- RabbitMQ之项目中实战
说了那么多,还不是为了在项目中进行实战吗,在实践中检验真理,不然我学他干嘛,不能解决项目中的实际问题的技术都是耍流氓... 一.后台管理系统发送消息 瞎咧咧:后台管理系统发送消息到交换机中,然后通知其 ...
- C++中的初始化列表
C++11扩大了列表初始化的适用范围,使其可以用于所有内置类型和用户定义的类型(即类对象). 1.当列表初始化用于内置类型的变量时,这种初始化形式有一个重要的特点:如果我们使用列表初始化且初始化值存在 ...
- action类中属性驱动和模型驱动的区别
1.Struts2的属性驱动 在Action类中,属性××通过get××()和set××()方法,把参数在整个生命周期内进行传递,这就是属性驱动 代码如下: package org.abu.csdn. ...
- 4. GC 算法(实现篇) - GC参考手册
您应该已经阅读了前面的章节: 垃圾收集简介 - GC参考手册 Java中的垃圾收集 - GC参考手册 GC 算法(基础篇) - GC参考手册 学习了GC算法的相关概念之后, 我们将介绍在JVM中这些算 ...
- windows事件查看器
如果一个软件发生异常,软件本身没有提示异常信息, 需要从事件查看器中查看产生的错误事件 运行输入eventvwr或者win + X
- Web框架django进阶篇
分页 一.Django内置分页 from django.shortcuts import render from django.core.paginator import Paginator, Emp ...