jQuery Bootstrap 日期选择器中的多个日期
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/25874375/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Multiple dates in Bootstrap date-picker
提问by nicholaswmin
I am trying to select multiple dates in Boostrap-Datepicker.
我正在尝试在Boostrap-Datepicker 中选择多个日期。
I have intialized the datepicker as such, just fine.
我已经初始化了日期选择器,很好。
$('#datepicker2').datepicker();
Now I want to select multiple dateson the calendar:
现在我想在日历上选择多个日期:
$('#datepicker2').datepicker('setDate', [new Date(2014, 2, 5),new Date(2014, 3, 5)]);
It's not working. No errors are logged but the dates are not selected.
它不起作用。不会记录任何错误,但不会选择日期。
EDIT:the datepicker version I used had some issue with multidates, I used a previous version and it works - probably a version issue
编辑:我使用的日期选择器版本在多日期方面存在一些问题,我使用了以前的版本并且它有效 - 可能是版本问题
This works just fine though:
不过,这很好用:
$('#datepicker2').datepicker('setDate', new Date(2014, 2, 5));
回答by AJ Gregory
It is necessary to first define your datepicker as a multidate picker through the options.
有必要首先通过选项将日期选择器定义为多日期选择器。
$('#datepicker2').datepicker({
multidate: true
});
Then you can set your dates via the setDates
method :
然后您可以通过以下setDates
方法设置日期:
$('.date').datepicker({
multidate: true
});
$('.date').datepicker('setDates', [new Date(2014, 2, 5), new Date(2014, 3, 5)])
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css" rel="stylesheet"/>
<input type="text" class="form-control date"/>
回答by Manish Nayak
You can also set limit for number of dates to be select. See below example, you will be able to select only 5 dates maximum.
您还可以设置要选择的日期数量限制。请参见下面的示例,您最多只能选择 5 个日期。
Example
例子
$("#Txt_Date").datepicker({
format: 'd-M-yyyy',
inline: false,
lang: 'en',
step: 5,
multidate: 5,
closeOnDateSelect: true
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css" rel="stylesheet"/>
<input type="text" id="Txt_Date" placeholder="Choose Date" style="cursor: pointer;">