bootstrap-datepicker 日期拾取器
最近开发的项目界面用的是bootstrap的框架,发现开源的东西真的很多,慢慢的我会记录到上面来
地址
http://www.bootcss.com/p/bootstrap-datetimepicker/
效果图

如何使用
引入
css bootstrap-datetimepicker.min.css
js bootstrap-datetimepicker.min.js、bootstrap-datetimepicker.zh-CN.js(汉化包)
代码
html:
<div class="col-lg-3">
<div class="input-group date form_date" data-date="" data-date-format="dd MM yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd">
<input class="form-control" size="16" type="text" value="" readonly>
<span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
<input type="hidden" id="dtp_input2" name="endTime" value="" />
</div>
<div class="col-lg-1">
<input type="submit" class="btn btn-block btn-primary" value="查询" />
</div>
js:
<script type="text/javascript">
$('.form_date').datetimepicker({
language: 'zh-CN',
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2,
minView: 2,
forceParse: 0
});
</script>
language: 'zh-CN'这个是汉化语句
这样就OK了
转载请注明地址:http://www.cnblogs.com/CoffeeEddy/p/bootstrap.html
bootstrap-datepicker 日期拾取器的更多相关文章
- bootstrap datetimepicker、bootstrap datepicker日期组件对范围的简单封装
1.bootstrap datepicker 使用 <div class="row form-group"> <label class="control ...
- 常见问题:bootstrap datepicker日期插件汉化
引入简体中文js(bootstrap-datepicker.zh-CN.js),并在datepicker属性配置language为‘zh-CN’即可,示例如下: $(".form_datet ...
- iOS UI-UIPickerView(拾取器)、UIWebView(网页视图)和传值方式
// // ViewController.m // IOS_0107_finalToolClass // // Created by ma c on 16/1/7. // Copyright (c) ...
- [Swift通天遁地]一、超级工具-(18)创建强大、灵活的日期时间拾取器
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- [Swift通天遁地]二、表格表单-(16)在表单行内嵌入日期和时间拾取器
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- jQuery Datepicker日期控件
datepicker可以为bootstrap添加一个事件选择控件,适用于任何需要调用的场合,支持多种事件格式输出(比如:dd, d, mm, m, yyyy, yy等),是制作网页不可缺失的插件. R ...
- bootstrap datepicker显示日历
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title> ...
- 使用datepicker日期插件
使用datepicker日期插件 在引入<jquery.js> <bootstrap.js><datepicker.js>之后 引用<bootstrap.cs ...
- 模块:(日期选择)jquery、bootstrap实现日期下拉选择+bootstrap jquery UI自带动画的日期选择器
一:jquery.bootstrap实现日期下拉选择 点击文本框弹出窗口 弹窗显示日期时间选择下拉 年份取当前年份的前后各5年 天数随年份和月份的变化而变化 点击保存,文本框中显示选中的日期 代码部分 ...
随机推荐
- 设置tomcat内存
设置Tomcat启动的初始内存其初始空间(即-Xms)是物理内存的1/64,最大空间(-Xmx)是物理内存的1/4. 可以利用JVM提供的-Xmn -Xms -Xmx等选项可进行设置 三.实例,以下给 ...
- cocos2d-x jsb 防止触摸事件传递
在游戏中要实现消息弹窗,让用户点击确认,其他区域产生遮罩,阻挡下层的事件被点击到,这是个很常用的功能,在cocos2d-x中,可以通过为layer添加事件代理来实现: pDirector->ge ...
- qt QSqlQuery
QT数据库QSqlQuery SQL执行操作 QSqlQuery提供了对数据库记录的Select.Insert.Update.Delete操作. SELECT操作: QSqlQuery query ...
- Android_Service
xml文件: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:t ...
- linux 软连接方式实现上传文件存储目录的无缝迁移
背景: 由于前期的磁盘空间规划与后期的业务要求不符合.原先/home被用于用户上传文件的存储目录,但是由于上传文件的逐渐增多,而原来的/home目录的空间不足,需要给/home目录进行扩容.同时各个应 ...
- Nginx高性能服务器安装、配置、运维 (1) —— Nginx简介
一.Nginx 简介 Nginx ("engine x") 是一个高性能的 HTTP 和 反向代理 服务器,同时也是一个 IMAP/POP3/SMTP 代理服务器. Nginx特点 ...
- 关于MD5校验和java工程下的校验
File file = new File("cos_code2003.bin"); System.out.println(file.length()); byte[] data = ...
- Installation error INSTALL_FAILED_VERSION_DOWNGRADE错误
最近折腾了一下Robotium自动化测试框架,发现问题还挺多,刚刚解决了一个问题,总算是把环境搞定了,可是一运行测试用例,发现又报Installation error INSTALL_FAILED_V ...
- sql 几个常用函数
ROUND 用法: --15.000 表示小数点第一位取四舍五入,将原小数点后的位数都设置为0SELECT ROUND(15.258,0) --15.300,第二个参数如果是1,则取原值小数点后第一位 ...
- Entity Framework 使用sql语句分页(查询单表)
1.查询单表 var pageSize = 2;//条数 var pageIndex = 2;//索引 var sql = @" SELECT D.* FROM ( SELECT ROW_N ...