禁用过去日期并仅在datepicker中启用某些未来日期

时间:2015-05-29 17:20:46

标签: javascript jquery datepicker mindate

我正在尝试使用jQuery datepicker,但希望禁用所有过去的日子,并且仅允许将来的星期四。我可以让它允许星期四,但我添加的minDate功能并不适用。这是我的代码:

<script>

jQuery(document).ready(function() {
    jQuery('#input_40_4').datepicker({
        beforeShowDay: function(date) { return [date.getDay() == 4, ""];}
   });
});

$(function () {
    $("#input_40_4'").datepicker({ minDate: 0 });
});

</script>

有人可以解释为什么这些不能一起工作吗?

3 个答案:

答案 0 :(得分:2)

您可以通过用逗号分隔来为datepicker添加更多选项。

$(document).ready(function() {
    $('#input_40_4').datepicker({
        beforeShowDay: function(date) { return [date.getDay() == 4, ""];},
        minDate : 0
        // you can add more options here as well, just seperate them by commas
   });
});

它们在您的问题中不起作用的原因是因为您将使用documentReady部分中的datepicker中的选项覆盖第10行中函数中创建的datepicker中的选项。

你基本上是在创建一个带有mindate的新日期选择器:0,不要介意只用星期二创建一个新的。

答案 1 :(得分:1)

正在发生的事情是你用第二个修改第一个datepicker调用的效果。

将两个选项放在一个选项对象

$("#input_40_4'").datepicker({
    beforeShowDay: function(date) { return [date.getDay() == 4, ""];},
    minDate: 0
});

演示

&#13;
&#13;
$("#datepicker").datepicker({
    beforeShowDay: function(date) { return [date.getDay() == 4, ""];},
    minDate: 0
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/black-tie/jquery-ui.css"></link>
<input type="text" id="datepicker" />
&#13;
&#13;
&#13;

答案 2 :(得分:1)

$("#datepicker").datepicker({
    beforeShowDay: function(date) { return [date.getDay() == 3, ""];},
    minDate: 0
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/black-tie/jquery-ui.css"></link>
<input type="text" id="datepicker" />