最近开发的项目界面用的是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 日期拾取器的更多相关文章

  1. bootstrap datetimepicker、bootstrap datepicker日期组件对范围的简单封装

    1.bootstrap datepicker 使用 <div class="row form-group"> <label class="control ...

  2. 常见问题:bootstrap datepicker日期插件汉化

    引入简体中文js(bootstrap-datepicker.zh-CN.js),并在datepicker属性配置language为‘zh-CN’即可,示例如下: $(".form_datet ...

  3. iOS UI-UIPickerView(拾取器)、UIWebView(网页视图)和传值方式

    // // ViewController.m // IOS_0107_finalToolClass // // Created by ma c on 16/1/7. // Copyright (c) ...

  4. [Swift通天遁地]一、超级工具-(18)创建强大、灵活的日期时间拾取器

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  5. [Swift通天遁地]二、表格表单-(16)在表单行内嵌入日期和时间拾取器

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  6. jQuery Datepicker日期控件

    datepicker可以为bootstrap添加一个事件选择控件,适用于任何需要调用的场合,支持多种事件格式输出(比如:dd, d, mm, m, yyyy, yy等),是制作网页不可缺失的插件. R ...

  7. bootstrap datepicker显示日历

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title> ...

  8. 使用datepicker日期插件

    使用datepicker日期插件 在引入<jquery.js> <bootstrap.js><datepicker.js>之后 引用<bootstrap.cs ...

  9. 模块:(日期选择)jquery、bootstrap实现日期下拉选择+bootstrap jquery UI自带动画的日期选择器

    一:jquery.bootstrap实现日期下拉选择 点击文本框弹出窗口 弹窗显示日期时间选择下拉 年份取当前年份的前后各5年 天数随年份和月份的变化而变化 点击保存,文本框中显示选中的日期 代码部分 ...

随机推荐

  1. 设置tomcat内存

    设置Tomcat启动的初始内存其初始空间(即-Xms)是物理内存的1/64,最大空间(-Xmx)是物理内存的1/4. 可以利用JVM提供的-Xmn -Xms -Xmx等选项可进行设置 三.实例,以下给 ...

  2. cocos2d-x jsb 防止触摸事件传递

    在游戏中要实现消息弹窗,让用户点击确认,其他区域产生遮罩,阻挡下层的事件被点击到,这是个很常用的功能,在cocos2d-x中,可以通过为layer添加事件代理来实现: pDirector->ge ...

  3. qt QSqlQuery

    QT数据库QSqlQuery   SQL执行操作 QSqlQuery提供了对数据库记录的Select.Insert.Update.Delete操作. SELECT操作: QSqlQuery query ...

  4. Android_Service

    xml文件: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:t ...

  5. linux 软连接方式实现上传文件存储目录的无缝迁移

    背景: 由于前期的磁盘空间规划与后期的业务要求不符合.原先/home被用于用户上传文件的存储目录,但是由于上传文件的逐渐增多,而原来的/home目录的空间不足,需要给/home目录进行扩容.同时各个应 ...

  6. Nginx高性能服务器安装、配置、运维 (1) —— Nginx简介

    一.Nginx 简介 Nginx ("engine x") 是一个高性能的 HTTP 和 反向代理 服务器,同时也是一个 IMAP/POP3/SMTP 代理服务器. Nginx特点 ...

  7. 关于MD5校验和java工程下的校验

    File file = new File("cos_code2003.bin"); System.out.println(file.length()); byte[] data = ...

  8. Installation error INSTALL_FAILED_VERSION_DOWNGRADE错误

    最近折腾了一下Robotium自动化测试框架,发现问题还挺多,刚刚解决了一个问题,总算是把环境搞定了,可是一运行测试用例,发现又报Installation error INSTALL_FAILED_V ...

  9. sql 几个常用函数

    ROUND 用法: --15.000 表示小数点第一位取四舍五入,将原小数点后的位数都设置为0SELECT ROUND(15.258,0) --15.300,第二个参数如果是1,则取原值小数点后第一位 ...

  10. Entity Framework 使用sql语句分页(查询单表)

    1.查询单表 var pageSize = 2;//条数 var pageIndex = 2;//索引 var sql = @" SELECT D.* FROM ( SELECT ROW_N ...