关于bootstrap的日历控件daterangepicker

本来想自己可见,但是好像csdn设置不了,仅仅作为笔记来用而已,一方面是复习,另一方面是以后自己可以查阅,请大神不要嘲笑。

首先你得引入daterangepicker.js  这个文件,

//

上面的input用来显示日历控件,在页面加载完成之后我们可以通过下面的函数来初始化日历控件,

每一个参数都有说明,minDate和maxDate能够很好的限制日历的时间范围,在页面显示的时候,有时候为了更好的控制日历范围这是一个不错的参数。

如果需要默认显示当前时间的话,在这里我还没有更好的方法,唯一的办法是在jsp页面可以获取当前时间,并且把当前时间转为字符串这是到input的value属性里面!

这其实就是js函数对input的value属性进行赋值而已。

$("#reservation").daterangepicker({
singleDatePicker: false,//设置为true时看看效果
showDropdowns: true,//必须设置
minDate:'05/17/2016',//最远日期
maxDate:'05/19/2016',//最长日期
});

$('#reservation').val('05/19/2016 - 05/19/2016');//默认为当前时间,


当前时间可以利用下面的代码来获取

var today=new Date();
var year = today.getFullYear();
var month = today.getMonth()+1;
var day = today.getDate();
var todayStr = ""+year+"/"+month+"/"+day;

$('#reservation').val(todayStr + ' - ' +todayStr );//默认为当前时间,


你可能感兴趣的:(bootstrap)