Bootstrap-datepicker3官方文档中文翻译---概述(原版翻译 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
bootstrap-datepicker
Bootstrap-datepicker 提供了一个拥有Bootstrap样式的弹性Datepicker控件

Dependencies/依赖
某些样式需要 bootstrap的dropdown组件 (dropdowns.less), 箭头需要bootstrap的sprites (sprites.less 和相关图片) .
通过lessc编译器运行 build/build_standalone.less文件可以生成一个独立的.css文件(包含必要的dropdown样式和备选的基于文字的箭头样式) //译者注:也就是其他可选的font图标箭头
$ lessc build/build_standalone.less datepicker.css
Usage/用法
通过JS调用:
$('.datepicker').datepicker();
Data API/ 数据API
因为有bootstrap自己的插件存在,所以Datepicker控件可以做到不需要你自己写javascript就可以被实例化. 在真正的bootstrap方式下,对于大部分datepicker来说, 在你想要初始化的元素上简单的设置 data-provide="datepicker" , 他就会懒初始化. 对于行内datepicker来说, 用 data-provide="datepicker-inline";这会使得控件在页面加载的时候就直接被初始化,而不是懒加载。
<input data-provide="datepicker">
在组件中标记:
<div class="input-group date" data-provide="datepicker">
<input type="text" class="form-control">
<div class="input-group-addon">
<span class="glyphicon glyphicon-th"></span>
</div>
</div>
你可以使用和其他你想金庸的bootstrap插件一样的方式来禁用datepicker的data-api。
$(document).off('.datepicker.data-api');
Configuration/配置项
在实例化的时候选项可以通过一个键值对的方式直接传递给Datepicker方法:
$('.datepicker').datepicker({
format: 'mm/dd/yyyy',
startDate: '-3d'
});
大部分选项可以使用 data-属性 的方式直接在目标元素上使用
<input class="datepicker" data-date-format="mm/dd/yyyy">
$('.datepicker').datepicker({
startDate: '-3d'
});
所有选项的默认值可以在 $.fn.datepicker.defaults中直接修改值。
$.fn.datepicker.defaults.format = "mm/dd/yyyy";
$('.datepicker').datepicker({
startDate: '-3d'
});
Stylesheets/样式
库中包含了少量的不同样式. 以下是每一个文件用于什么地方的概览:
bootstrap-datepicker.css 对于bootstrap2提供传统支持, bootstrap-datepicker3.css 支持bootstrap3。而 bootstrap-datepicker.standalone.css 可以脱离对于bootstrap库的依赖而独立使用.
No Conflict mode/无冲突模式
$.fn.datepicker.noConflict 提供了避免和其他jQuery datepicker控件冲突的方法:
var datepicker = $.fn.datepicker.noConflict(); // return $.fn.datepicker to previously assigned value
$.fn.bootstrapDP = datepicker; // give $().bootstrapDP the bootstrap-datepicker functional 转载请注明出处:博客园-tincyho http://www.cnblogs.com/tincyho/
Bootstrap-datepicker3官方文档中文翻译---概述(原版翻译 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)的更多相关文章
- Bootstrap-datepicker3官方文档中文翻译---概述(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
bootstrap-datepicker Bootstrap-datepicker 提供了一个拥有Bootstrap样式的弹性Datepicker控件 Requirements/使用要求 Bootst ...
- Bootstrap-datepicker3官方文档中文翻译---Markup/标记(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
Markup/标记 下面是已经支持的标签的例子.这些标签本身不会提供DatePicker控件:你需要在标签上实例化Datepicker. input/输入框 最简单的例子: input获得焦点 (使用 ...
- Bootstrap-datepicker3官方文档中文翻译---I18N/国际化(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
I18N/国际化 这个插件支持月份和星期名以及weekStart选项的国际化.默认是英语(“en”); 其他有效的译本语言在 js/locales/ 目录中, 只需在插件后包含您想要的地区. 想要添加 ...
- Bootstrap-datepicker3官方文档中文翻译---Keyboard support/键盘支持(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
本日期控件包含了键盘导航. “focused date” 在键盘导航期间一直会被保持追踪并且高亮显示(就想鼠标悬停的时候一样),当一个日期被切换(译者注:选中状态的切换)时或者控件隐藏时清除. up ...
- Bootstrap-datepicker3官方文档中文翻译---Event/事件(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
Events/事件 DatePicker在某些情况下触发一些事件.所有事件都拥有 传递给任何事件处理程序的 事件对象的 附加数据.(译者注:这里英语拗口,汉语也拗口,我用空格给大家断断句) ...
- Bootstrap-datepicker3官方文档中文翻译---Methods/方法(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
Methods/方法 方法是由 datepicker 函数调用的,第一个参数为字符串,随后是方法所需的任何参数. $('.datepicker').datepicker('method', arg1, ...
- Bootstrap-datepicker3官方文档中文翻译---Options/选项(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)
Options/选项 带“Date”的所有选项都可以处理 Date 对象; 字符串格式化根据 给定的 format 而定; 相对于今天的时间变量, 如 “-1d”, “+6m +1y”等等, 其中有效 ...
- Spark官方文档 - 中文翻译
Spark官方文档 - 中文翻译 Spark版本:1.6.0 转载请注明出处:http://www.cnblogs.com/BYRans/ 1 概述(Overview) 2 引入Spark(Linki ...
- Spark SQL 官方文档-中文翻译
Spark SQL 官方文档-中文翻译 Spark版本:Spark 1.5.2 转载请注明出处:http://www.cnblogs.com/BYRans/ 1 概述(Overview) 2 Data ...
随机推荐
- keepalived实现nginx高可用
keepalived是什么 keepalived直译就是保持存活,在网络里面就是保持在线了,也就是所谓的高可用或热备,用来防止单点故障(单点故障是指一旦某一点出现故障就会导致整个系统架构的不可用)的发 ...
- Windows删除文件时找不到该项目
当在Windows删除文件时出现找不到该项目或者显示该文件不在磁盘中,可以尝试以下方法: 在要删除文件的同级目录下 新建一文本文档,将下列代码复制到文档中,将文档保存为后缀名为.bat的文档(名字随意 ...
- Python学习笔记(五)--Python数据类型-数字及字符串
Python数据类型:123和'123'一样吗?>>> 123=='123'False>>> type(123)<type 'int'>>> ...
- 数据库.MongoDB.安装MongoDB数据库
树莓派安装方法 版本: mongodb 2.4.10 sudo apt-get install mongodb -y 安装完成后,检查命令 mongo 看到下图的内容,表示已安装并启动成功 ===== ...
- cordova封装h5为app,cookie不可用解决方法
//创建cookie function setCookie(c_name,value,expiredays) { var exdate=new Date(); exdate.setDate(exdat ...
- LeetCode 257. Binary Tree Paths (二叉树路径)
Given a binary tree, return all root-to-leaf paths. For example, given the following binary tree: 1 ...
- 纯js实现DIV拖拽
写代码的时候遇到需要对绝对布局的div进行拖拽的功能,起初为了省事直接在网上扒拉了一番,看到大神张鑫旭的一篇文章<JavaScript实现最简单的拖拽效果>,便直接拿来使用(膜拜大神).但 ...
- centos 源码安装python
一.准备环境 首先在官网下载想要的python对应版本http//www.python.org/downloads/source 下载tgz就可以了.文件有两种 1,Python-版本号.tgz(解压 ...
- Problem J
Problem Description 有一楼梯共M级,刚开始时你在第一级,若每次只能跨上一级或二级,要走上第M级,共有多少种走法? Input 输入数据首先包含一个整数N,表示测试实例的个数,然后是 ...
- linux dig 命令
dig 命令主要用来从 DNS 域名服务器查询主机地址信息. 查询单个域名的 DNS 信息 dig 命令最典型的用法就是查询单个主机的信息. $ dig baidu.com dig 命令默认的输出信息 ...