Eonasdan bootstrap datetimepicker 使用记录
开始用的 bootstrap日期选择控件是 bootstrap-datepicker :
$('#visit_date').datepicker({
todayHighlight: true,
startDate: '+1d',
format: 'yyyy/mm/dd',
language: 'zh-CN',
orientation: 'bottom right',
autoclose: 'true'
});
后来需要支持时间选择,改用了 eonasdan-bootstrap-datetimepicker :
$('#visit_date').datetimepicker({
locale: 'zh-CN',
minDate: moment().add(1, 'days').hours(9).startOf('hour'),
format: 'YYYY/MM/DD hh:mm',
daysOfWeekDisabled: [1],
reenabledDates: ['2018-04-30', '2018-06-18', '2018-09-24', '2018-10-01'],
enabledHours: [9, 10, 11, 12, 13, 14, 15, 16, 17]
});
它是基于 momentjs 实现的。
locale 设置当前的语言。
minDate 设置允许选择的最早时间,比如上面的示例设置为第2天早上9:00。
format 日期时间格式(就是 momentjs 支持的格式),比如上面的示例格式对应的时间是 2018/01/10 09:00 。
daysOfWeekDisabled 禁止选择周几,比如上面的示例禁止选择周一。
enabledHours 限制可以选择的时间,比如上面的示例只允许选择 9:00 ~ 17:00 。
reenabledDates 是我修改源代码实现的(详见博问) ,允许选择被 daysOfWeekDisabled 禁止的日期,在 github 上提交 pull request 时才发现 Eonasdan 已另起炉灶。
This repo is no longer actively monitor or supported. All future work is being done to https://github.com/tempusdominus/bootstrap-3
Eonasdan bootstrap datetimepicker 使用记录的更多相关文章
- bootstrap datetimepicker 在 angular 项目中的运用
datetimepocker 是一个日期时间选择器,bootstrap datetimepicker 是 bootstrap 日期时间表单组件.访问 bootstrap-datetimepicker ...
- Angularjs与bootstrap.datetimepicker结合实现日期选择器
http://www.lovelucy.info/angularjs-best-practices.html http://damoqiongqiu.iteye.com/blog/1917971 ht ...
- bootstrap datetimepicker 格式化yyyymmdd时,无法读取yyyymmdd格式
不知为何,java程序员爱用yyyymmdd格式化日期?导致bootstrap datetimepicker无法解析正确的日期 发现js中yyyymmdd不是正常能够解析的日期 查看datetimep ...
- bootstrap datetimepicker的参数解释
使用bootstrap datetimepicker(日期时间选择器)的过程中,发现中文参数说明和英文参数说明严重不符,所以结合自己使用的情况和英文参数说明,做了如下翻译. $(".form ...
- bootstrap datetimepicker、bootstrap datepicker日期组件对范围的简单封装
1.bootstrap datepicker 使用 <div class="row form-group"> <label class="control ...
- bootstrap datetimepicker 位置错误
bootstrap datetimepicker 位置错误,大致问题跟其他网友描述的一样,页面自动出滚动条,然后datetimepicker飘到页脚,网上的方法都是修改place方法里面的555行左右 ...
- BootStrap DateTimePicker的使用
使用方法 1. 添加资源 2. 编写代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Conte ...
- 在asp.net mvc4项目里bootstrap datetimepicker控件的使用
前段时间写了一篇关于调用阿里大于的短信接口来开发例会短信群发通知功能的文章http://www.cnblogs.com/zhouyuangan/p/apicall_1.html,其中的例会时间是需求中 ...
- bootstrap datetimepicker时间日期控件
github地址:https://github.com/smalot/bootstrap-datetimepicker Both Date and Time picker widget based o ...
随机推荐
- phpbbchina恢复上线
上个月已经把ICP备案重新办过了, 但是一直在忙着应付工作上的事. 从上周末开始经过数天的努力, 将 phpbbchina 恢复上线了. 时间一晃, 正好十年. 目前能找到的最新的数据是2008-10 ...
- java webdriver的api的封装
我们来看一下官网提供的代码写法,即最原始的写法: driver.findElement(By.id("kw")).click() 这样写是没任何问题的,但这样没有把元素对象,数据, ...
- Redis集群搭建(转自一菲聪天的“Windows下搭建Redis集群”)
配置Redis参考:http://blog.csdn.net/zsg88/article/details/73715947 使用Ruby配置集群参考:https://www.cnblogs.com/t ...
- Swift 静态派发和动态派发
前言 方法是 Swift 中的一个重要概念,方法允许你把需要复用的代码封装进方法中,这样当你调用方法时,实际上你的想法是执行方法中的那些代码,方法的出现极大的提高了方法的复用性. Swift 工程的环 ...
- selenium是如何启动浏览器的
前几天有同学问到selenium是怎么样启动浏览器的(selenium启动浏览器的原理),当时稍微讲解了一下,不过自我感觉不够具体,现在特地把启动原理通过代码和一系列操作给串联起来,希望可以帮助大家更 ...
- ES6,Array.from()函数的用法
ES6为Array增加了from函数用来将其他对象转换成数组. 当然,其他对象也是有要求,也不是所有的,可以将两种对象转换成数组. 1.部署了Iterator接口的对象,比如:Set,Map,Arra ...
- 【网络】TCP和UDP的区别以及TCP的三次握手四次释放
一.两者区别 1.TCP面向连接的运输层协议,UDP无连接 2.TCP是可靠交付,UDP是尽最大努力交付 3.TCP面向字节流,UDP面向报文 4.TCP是点对点连接的,UDP一对一,一对多,多对多都 ...
- 2. Tensorflow的数据处理中的Dataset和Iterator
1. Tensorflow高效流水线Pipeline 2. Tensorflow的数据处理中的Dataset和Iterator 3. Tensorflow生成TFRecord 4. Tensorflo ...
- 【iCore4 双核心板_FPGA】例程八:乘法器实验——乘法器使用
实验现象: 程序运行时,绿色led闪烁(目前,具体的乘法器调用请参考iCore3乘法器例程) 核心代码: module multiplier_ctrl( input clk_25m, input rs ...
- 学习MongoDB(Troubleshoot Replica Sets) 集群排除故障
Test Connections Between all Members(集群中节点网络测试) 在进行Mongodb集群时,每个节点的网络都需要互动,假设有3个服务器节点. m1.example.ne ...