js脚本和css样式，到bootstrap官网去下载

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="Default/jquery-1.9.1.min.js"></script>
<script src="Default/bootstrap.js"></script>
<script src="Default/modealayer.js/layer/layer.min.js"></script>
<script src="Default/modealayer.js/layer/w-modal-3.0-min.js"></script>
<script src="Default/w_formList/w-list-min.js"></script>
<script src="Default/dateTime/dateTiemMain.js"></script>
<link href="Default/dateTime/daterangepicker-bs3.css" rel="stylesheet" />
<script src="Default/dateTime/moment.min.js"></script>
<script src="Default/dateTime/datepicker.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet" />
</head>
<body>
<!--双日历-->
<div class="w-l-doudate">
<div class="col-lg-2 w-l-doudate-g">
<div class="input-group">
<span class="input-group-addon w-input-group-addon w-date-ioc w-l-fd">
<i class="fa fa-plus fa-calendar"></i>
</span>
<input type="text" class="form-control notext" id="SelectDate" placeholder="请选择时间" readonly="readonly" />
</div>
</div>
</div>
<script type="text/javascript">

$(document).ready(function () {
//双日历 实例
$('#SelectDate').daterangepicker({
startDate: moment().startOf('day'),
format: 'YYYY/MM/DD', timePicker: false, showDropdowns: true,
ranges: {
//'最近1小时': [moment().subtract('hours',1), moment()],
'今日': [moment().startOf('day'), moment()],
'昨日': [moment().subtract('days', 1).startOf('day'), moment().subtract('days', 1).endOf('day')],
'最近7日': [moment().subtract('days', 6), moment()],
'最近30日': [moment().subtract('days', 29), moment()]
},
opens: 'left',
}, function (start, end, label) {

});

})

function GetCheckboxVal() {
var cheval = Getccxvstate();

}

</script>
</body>

</html>

daterangepicker-双日历的更多相关文章

  1. daterangepicker双日历插件的使用

    今天主要是由于项目的需要,做了一个daterangepicker双日历插件,做出来的效果如下: 个人感觉这个daterangepicker双日历插件很好用,并且实现起来也不是很麻烦,我是根据它的官方文 ...

  2. daterangepicker 双日历/格式化日期/日期限制minDate，maxDate

    var locale = { "format": 'YYYY/MM/DD', "separator": " - ", "apply ...

  3. daterangepicker+ bootstrap +php +ajax +datatable双日历的使用

    在练习基于bootstrap   datatable的使用时,时间插件用到了daterangepicker,特做稍微了解,效果如图: 1.html <div class="panel& ...

  4. bootstrap之双日历时间段选择控件—daterangepicker(汉化版)

    jQuerybootstrapdaterangepicker汉化版 双日历时间段选择插件 — daterangepicker是bootstrap框架后期的一个时间控件,可以设定多个时间段选项,也可以自 ...

  5. 双日历时间段选择控件—daterangepicker(汉化版)

    daterangepicker的配置信息,记录下来方便设置: <pre name="code" class="html"><pre name= ...

  6. bootstrap之双日历时间段选择控件示例—daterangepicker(汉化版)

    效果图: 参考代码: <link href="/public/static/common/css/daterangepicker.min.css?ver=0.6" rel=& ...

  7. 基于bootstrap的双日历插件 daterangepicker

    我遇到需求是要求我将daterangepicker的一个双日期选择格式修改成两个单日期格式的日期选择框(方便手机端显示),要求如下: 1.两个单日期格式分别为开始日期和结束日期 2.开始日期可选择范围 ...

  8. bootstrap之双日历时间段选择控件示例—daterangepicker(中文汉化版)

    效果图: 参考代码: <link href="/css/daterangepicker.min.css?ver=0.6" rel="stylesheet" ...

  9. bootstrap双日历插件实例化

    网站中难免会用到日期选择插件,常见的有jquery的,也有bootstrap的.单日历的就不说了,实例化都比较简单.今天给大家介绍一下bootstrap的双日历插件. http://www.jq22. ...

  10. 日期时间范围选择插件:daterangepicker使用总结

    分享说明: 项目中要使用日期时间范围选择对数据进行筛选;精确到年月日 时分秒;起初,使用了layui的时间日期选择插件;但是在IIE8第一次点击会报设置格式错误;研究了很久没解决,但能确定不是layu ...

随机推荐

  1. Struts2 结合 Freemarker 实例

     Freemarker 是一个不依赖 web 容器的模板引擎,一个基于模板生成文本输出的工具.其工作的原理如下图: freemarker 不是一个 web 应用的框架,而适合作为 web 应用的一个组 ...

  2. [转]SQL 模糊查询

      在进行数据库查询时,有完整查询和模糊查询之分. 一般模糊查询语句如下: SELECT 字段 FROM 表 WHERE 某字段 Like 条件 其中关于条件,SQL提供了四种匹配模式: 1,% :表 ...

  3. ngx-bootstrap使用04 carousel组件

    1 carousel 是一个通过循环播放图片.文本的幻灯片:就像一个旋转旋转木马一样,但是不支持嵌套使用 2 如何使用 2.1 搭建ngx-bootstrap使用环境 参见博文:点击前往 2.2 在模 ...

  4. c# 类的初步认识

    这里我们把类分为三种: String类(字符串类):Math类(数学类):DateTime类(时间日期类). 在使用类时注意  在输入的过程中代码前面会出现一些符号(紫色立方体代表方法,函数和黑色扳手 ...

  5. 生产者与消费者-N：N-基于list

    多个生产者/多个消费者: /** * 生产者 */ public class P { private MyStack stack; public P(MyStack stack) { this.sta ...

  6. String/StringBuilder 类 用对象数组实现登录注册功能

    一.需求说明:实现用户注册.登陆功能: 程序中使用一个长度为3的对象数组,存储用户的登录名和密码: 例如如下格式: 登录名    密码      生日           爱好 zhangsan 11 ...

  7. iOS 隐藏App图标

    1.在进入Info.plist文件 2.在Info.plist文件中新添加一项,把Key值设置为SBAppTags,在Type选项中选取Array 3.在Array中新添加一项Item0,Type类型 ...

  8. tar打包tar.gz文件

    命令格式: tar zcvf dir.tar.gz ./dir 压缩后的文件解压出来会是dir这个文件夹

  9. C语言实现文件实时更新

    一.简介 在linux或者unix操作系统中在系统引导的时候会开启很多服务,这些服务就叫做守护进程. 守护进程脱离了终端并且在后台运行:守护进程脱离于终端是为了避免进程在执行过程中的信息在任何终端上显 ...

  10. Entity Framework Tutorial Basics（37）：Lazy Loading

    Lazy Loading: One of the important functions of Entity Framework is lazy loading. Lazy loading means ...