Bootstrap 3 Datepicker 使用过程
最近在创建记录的时候,需要用到日历的功能。本身是使用的bootstrap布局的,所以就找到Datepicker,看了一下用起来还是挺方便的。下面就是使用过程。
依赖的资源
- jQuery
- Moment.js
- Bootstrap.js
- Bootstrap Datepicker script
- Bootstrap CSS
- Bootstrap Datepicker CSS
安装方式
由于我是Visual Studio开发工具,所以就使用bower安装这个资源。
bower install eonasdan-bootstrap-datetimepicker#latest --save
通过上面的命令,就将资源引入到工程里了。下面就可以在页面中使用了。
<head>
<!-- ... -->
<script type="text/javascript" src="/bower_components/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/bower_components/moment/min/moment.min.js"></script>
<script type="text/javascript" src="/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/bower_components/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="/bower_components/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css" />
</head>
Bootstrap 3 Datepicker 使用过程的更多相关文章
- bootstrap的datepicker在选择日期后调用某个方法
bootstrap的datepicker在选择日期后调用某个方法 2016-11-08 15:14 1311人阅读 评论(0) 收藏 举报 首先感谢网易LOFTER博主Ivy的博客,我才顿悟了问题所在 ...
- bootstrap的datepicker使用(1.将默认的英文设置为中文2.选择日月年的时候记录之前的操作)
参考网页 bootstrap datepicker 属性设置 以及方法和事件 1.如何将bootstrap的datepicker默认的英文设置为中文 第一步,新建一个js文件(bootstrap ...
- 关于bootstrap的datepicker在meteor应用中的使用(不包含bootstrap框架)
1.安装bootstrap3-datepicker包 meteor add rajit:bootstrap3-datepicker 2.使用方法 Example In your handlebars ...
- 基于bootstrap的datepicker
<script src="<%=path %>/js/bootstrap-datepicker.min.js"/> <script src=" ...
- Bootstrap的datepicker控件
为input 控件的text 添加datepicker()方法后,原本的控件change事件无法正常触发.原因是项目中同时使用了用了jquery ui,碰巧它里面也有一个datepicker,名字一模 ...
- 关于bootstrap插件datepicker
<input readonly size="16" type="text" name="time" id="time&q ...
- (转)Bootstrap 之 Metronic 模板的学习之路 - (4)源码分析之脚本部分
https://segmentfault.com/a/1190000006709967 上篇我们将 body 标签主体部分进行了简单总览,下面看看最后的脚本部门. 页面结尾部分(Javascripts ...
- openwrt设置语言的过程
设置语言的流程一.关联的配置文件/etc/config/luci查看配置文件内容如下:root@hbg:/# cat /etc/config/luci config core 'main' ...
- bootstrap 切换页签失效的解决方法
概述 bootstrap开发标签页时,标签页显示正常,但点击时候对应内容区域没有变化. 具体症状与解决方案 1.标签页UI出现,但点击无反应,标签页UI并未随点击进行切换 先检查bootstrap.c ...
随机推荐
- 关于IOS音频的开发积累
1.设置类别,表示该应用同时支持播放和录音 OSStatus error; UInt32 sessionCategory = kAudioSessionCategory_PlayAndRecord; ...
- Wordpress基础:安装主题和插件
一:安装主题 1.下载主题 2.解压至wordpress目录下的/wp-content/themes 3.访问后台>外观>主题启用即可 二:安装插件 1.下载插件 2.解压至wordpre ...
- c# json TO xml
using System.IO;using System.Text;using System.Xml.Serialization;using System.Xml;using System.Runti ...
- 在strust2 框架下,前端APP传过来的中文数据乱码问题
public String addMessage() throws UnsupportedEncodingException{ Patient patient=new Patient(); patie ...
- iOS学习路线图
一.iOS学习路线图 二.iOS学习路线图--视频篇 阶 段 学完后目标 知识点 配套学习资源(笔记+源码+PPT) 密码 基础阶段 学习周期:24天 学习后目标: ...
- 在Linux下禁用IPv6的方法小结
在Linux下禁用IPv6的方法小结--http://www.jb51.net/LINUXjishu/335724.html 这篇文章主要介绍了在Linux下禁用IPv6的方法小结,禁用IPv6的操作 ...
- 安装ionic出现node-sass无法下载的解决方法
解决方法: 修改C:\users\[用户名]下的.npmrc文件: registry=https://registry.npm.taobao.org sass-binary-site=https:// ...
- Jquery父级节点追加
<!-- 父节点追加 --><!DOCTYPE html><html lang="en"><script src="../../ ...
- ThroughRain第一次冲刺(每天更新)
第一次冲刺时间: 11月14-11月23 第一次冲刺目标及分配: 1.注册登录界面 认领:王大华 2.界面跳转 认领:梁仕标 3.点餐界面 ...
- jQuery插件的开发之$.extend(),与$.fn.extend()
jQuery插件的开发包括两种: 一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery类本身添加方法.jQuery的全局函数就是属于jQuery命名空间的函数,另一种 ...