bootstrap-datepicker

Bootstrap-datepicker 提供了一个拥有Bootstrap样式的弹性Datepicker控件

Requirements/使用要求

这两个版本是经过测试的,其他版本风险自负。

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)的更多相关文章

  1. Bootstrap-datepicker3官方文档中文翻译---概述(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    bootstrap-datepicker Bootstrap-datepicker 提供了一个拥有Bootstrap样式的弹性Datepicker控件 Requirements/使用要求 Bootst ...

  2. Bootstrap-datepicker3官方文档中文翻译---Markup/标记(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    Markup/标记 下面是已经支持的标签的例子.这些标签本身不会提供DatePicker控件:你需要在标签上实例化Datepicker. input/输入框 最简单的例子: input获得焦点 (使用 ...

  3. Bootstrap-datepicker3官方文档中文翻译---I18N/国际化(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    I18N/国际化 这个插件支持月份和星期名以及weekStart选项的国际化.默认是英语(“en”); 其他有效的译本语言在 js/locales/ 目录中, 只需在插件后包含您想要的地区. 想要添加 ...

  4. Bootstrap-datepicker3官方文档中文翻译---Keyboard support/键盘支持(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    本日期控件包含了键盘导航.  “focused date” 在键盘导航期间一直会被保持追踪并且高亮显示(就想鼠标悬停的时候一样),当一个日期被切换(译者注:选中状态的切换)时或者控件隐藏时清除. up ...

  5. Bootstrap-datepicker3官方文档中文翻译---Event/事件(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    Events/事件 DatePicker在某些情况下触发一些事件.所有事件都拥有   传递给任何事件处理程序的  事件对象的    附加数据.(译者注:这里英语拗口,汉语也拗口,我用空格给大家断断句) ...

  6. Bootstrap-datepicker3官方文档中文翻译---Methods/方法(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    Methods/方法 方法是由 datepicker 函数调用的,第一个参数为字符串,随后是方法所需的任何参数. $('.datepicker').datepicker('method', arg1, ...

  7. Bootstrap-datepicker3官方文档中文翻译---Options/选项(原文链接 http://bootstrap-datepicker.readthedocs.io/en/latest/index.html)

    Options/选项 带“Date”的所有选项都可以处理 Date 对象; 字符串格式化根据 给定的 format 而定; 相对于今天的时间变量, 如 “-1d”, “+6m +1y”等等, 其中有效 ...

  8. Spark官方文档 - 中文翻译

    Spark官方文档 - 中文翻译 Spark版本:1.6.0 转载请注明出处:http://www.cnblogs.com/BYRans/ 1 概述(Overview) 2 引入Spark(Linki ...

  9. Spark SQL 官方文档-中文翻译

    Spark SQL 官方文档-中文翻译 Spark版本:Spark 1.5.2 转载请注明出处:http://www.cnblogs.com/BYRans/ 1 概述(Overview) 2 Data ...

随机推荐

  1. 使用 paddle来进行文本生成

    paddle 简单介绍 paddle 是百度在2016年9月份开源的深度学习框架. 就我最近体验的感受来说的它具有几大优点: 1. 本身内嵌了许多和实际业务非常贴近的模型比如个性化推荐,情感分析,词向 ...

  2. Linux系统挂载操作mount详解

    在Linux系统中,文件系统不挂载是无法使用的.挂载,即是让文件系统在操作系统中可用.在Linux中使用mount命令来挂载文件系统,有永久性挂载和临时性挂载两种挂载方式. 1. 永久性挂载: 修改配 ...

  3. 正则表达式&常用JS校验

    符号 含义 ^ 以什么开头 $ 以什么结束 * 任意个(包括0个) + 至少一个 ? 没有或一个 {a,b} a-b个 {a} 正好a个 {a,} 至少a个 | 或 . 任意字符 [] 方括号内的任意 ...

  4. Android O --Soong Build

    Concept: Kati (https://android.googlesource.com/platform/build/kati/) - Reads Android.mk files -> ...

  5. C#读写Shapefile

    Shapefile文件是ArcGIS存储矢量要素的标准格式,要读写Shapefile最简单的方法当然是基于ArcObject(或者ArcEngine)开发,不过网上也有一些开源的解译Shapefile ...

  6. sqoop1.9.7安装和使用

    安装1.下载sqoop1.9.7.地址: http://www.apache.org/dyn/closer.lua/sqoop/1.99.72.解压sqoop ,并配置环境变量 ~/.bash_pro ...

  7. dfs序和欧拉序

    生命不息,学习不止,昨天学了两个算法,总结一下,然而只是略懂,请路过的大佬多多谅解.   一.dfs序 1.什么是dfs序? 其实完全可以从字面意义上理解,dfs序就是指一棵树被dfs时所经过的节点的 ...

  8. Fibonacci Check-up

    Fibonacci Check-up Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) ...

  9. 最长上升子序列(logN算法)

    例如:1 7 3 5 9 4 8 一个序列,比如说a[]={1,7,3,5,9,4,8},找出它的最长上升子序列的个数,很明显是4个,可以是{1,3,5,9},{1,3,5,8}或者{1,3,4,8} ...

  10. Python学习第一周

    一.我的第一个程序 print("Hello word!") 所以说python是一款非常简洁的语言,不像c,c++等等写一个简单的小程序还要调用一堆库.另外,python 3的版 ...