BootStrap 年份范围

Posted 2023-05-07

【中文标题】BootStrap 年份范围

【英文标题】：BootStrap Year range

【发布时间】：2014-12-02 18:23:35

【问题描述】：

我想指定两个日期选择器之间的范围。 from 和 to 如下所示

在上图中，我选择 from year 作为 2011 年，现在我不想选择 to year 小于一年。如何做到这一点。

代码

$('#from').datepicker(
        format: "yyyy",
        autoclose: true,
        minViewMode: "years"
);

$('#to').datepicker(
        format: "yyyy",
        autoclose: true,
        minViewMode: "years"
);

JS Fiddle

【问题讨论】：

@TusharGupta 我加了小提琴请检查一下

这可能对你有帮助***.com/questions/21438647/…

【参考方案1】：

查看Fiddle

代码

$('#from').datepicker(
        format: "yyyy",
        autoclose: true,
        minViewMode: "years"
)    .on('changeDate', function(selected)
        startDate =  $("#from").val();
        $('#to').datepicker('setStartDate', startDate);
    ); 
;


$('#to').datepicker(
        format: "yyyy",
        autoclose: true,
        minViewMode: "years"
);

见

 on('changeDate', function(selected)
     startDate =  $("#from").val();
     $('#to').datepicker('setStartDate', startDate);
); 

逻辑：

在我选择 From year 之后，我使用 $('#to').datepicker('setStartDate', startDate); 设置 From Datepicker 设置的最小年份。

【讨论】：

请将您的小提琴代码粘贴到答案中，以便用户可以轻松查看您的代码。

【参考方案2】：

由于这是一个常见问题，因此到目前为止有很多关于此问题的帖子。 他们中的大多数与您的几乎完全相同。

你可以查看这个，例如它也是用 ajax / jQuery 编写的 jQuery Date Picker - disable past dates

这个特别是关于在日期选择器上禁用过去的日期： disable past dates on datepicker

所以它或多或少是重复的问题，您可以从已经提出的问题中解决这个问题。

有关 minDate 的更多信息，请参阅 API： http://jqueryui.com/datepicker/#option-minDate

我想一个修复检查将设置 minDate 像这样（感谢 Dasun 在上面给出的链接中编写了这段代码）

minDate: dateToday Or minDate: '0' is the key here. Try to set the minDate property.

$(function() 
    $( "#datepicker" ).datepicker(
            numberOfMonths: 2,
            showButtonPanel: true,
            minDate: dateToday // minDate: '0' would work too
        );
);

【讨论】：

我有两个日期选择器from 和to。我想要这两个日期选择器之间的范围。

【参考方案3】：

这是demo

您只需要指定您的“来自”日期选择器的 onSelect 属性：

onSelect: function()
    $('#to').datepicker('option', 'minDate', new Date($(this).datepicker("getDate").getFullYear(),0,1));       

【讨论】：

这是 JQUERY CALENDER 用户想要 BOOOTSTRAP