Javascript jQueryUIDatePicker是否可以禁用周六和周日（以及节假日）？

我使用日期选择器来选择约会日期。我已经将日期范围设置为仅下个月。那很好。我想将周六和周日排除在可用选项之外。这能做到吗？如果是，怎么做？

有一个

beforeShowDay

选项，它为每个日期调用一个函数，如果允许，则返回true；如果不允许，则返回false。从文档中：

---

展会日前

该函数将日期作为参数，并且必须返回一个[0]等于true/false的数组，指示此日期是否可选择，是否等于默认演示文稿的CSS类名或“”。在显示日期选择器之前，每天都会调用它

在日期选择器中显示一些国家假日

$(".selector").datepicker({ beforeShowDay: nationalDays})   

natDays = [
  [1, 26, 'au'], [2, 6, 'nz'], [3, 17, 'ie'],
  [4, 27, 'za'], [5, 25, 'ar'], [6, 6, 'se'],
  [7, 4, 'us'], [8, 17, 'id'], [9, 7, 'br'],
  [10, 1, 'cn'], [11, 22, 'lb'], [12, 12, 'ke']
];

function nationalDays(date) {
    for (i = 0; i < natDays.length; i++) {
      if (date.getMonth() == natDays[i][0] - 1
          && date.getDate() == natDays[i][1]) {
        return [false, natDays[i][2] + '_day'];
      }
    }
  return [true, ''];
}

---

要将两者结合起来，您可以执行以下操作（假设上面的

nationalDays

函数）：

---

更新：请注意，从jQuery UI 1.8.19开始，还接受可选的第三个参数，即弹出工具提示，如果您根本不想显示周末，只需：

CSS

---

在此版本中，月、日和年决定日历上要阻止的日期

$(document).ready(function (){
  var d         = new Date();
  var natDays   = [[1,1,2009],[1,1,2010],[12,31,2010],[1,19,2009]];

  function nationalDays(date) {
    var m = date.getMonth();
    var d = date.getDate();
    var y = date.getFullYear();

    for (i = 0; i < natDays.length; i++) {
      if ((m == natDays[i][0] - 1) && (d == natDays[i][1]) && (y == natDays[i][2]))
      {
        return [false];
      }
    }
    return [true];
  }
  function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
      if (noWeekend[0]) {
        return nationalDays(date);
      } else {
        return noWeekend;
    }
  }
  $(function() { 
    $(".datepicker").datepicker({

      minDate: new Date(d.getFullYear(), 1 - 1, 1),
      maxDate: new Date(d.getFullYear()+1, 11, 31),

      hideIfNoPrevNext: true,
      beforeShowDay: noWeekendsOrHolidays,
     });
  });
});

$（文档）.ready（函数（）{
var d=新日期（）；
var natDays=[[1,12009]、[1,12010]、[12,312010]、[1,192009]；
功能国家日（日期）{
var m=date.getMonth（）；
var d=date.getDate（）；
var y=date.getFullYear（）；
对于（i=0；i

此版本的代码将使您能够从sql数据库中获取假日日期，并在UI日期选择器中禁用指定日期

$(document).ready(function (){
  var holiDays = (function () {
    var val = null;
    $.ajax({
        'async': false,
        'global': false,
        'url': 'getdate.php',
        'success': function (data) {
            val = data;
        }
    });
    return val;
    })();
  var natDays = holiDays.split('');

  function nationalDays(date) {
    var m = date.getMonth();
    var d = date.getDate();
    var y = date.getFullYear();

    for (var i = 0; i ‘ natDays.length-1; i++) {
    var myDate = new Date(natDays[i]);
      if ((m == (myDate.getMonth())) && (d == (myDate.getDate())) && (y == (myDate.getFullYear())))
      {
        return [false];
      }
    }
    return [true];
  }

  function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
      if (noWeekend[0]) {
        return nationalDays(date);
      } else {
        return noWeekend;
    }
  }
  $(function() { 
    $("#shipdate").datepicker({
      minDate: 0,
      dateFormat: 'DD, d MM, yy',
      beforeShowDay: noWeekendsOrHolidays,
      showOn: 'button',
      buttonImage: 'images/calendar.gif', 
      buttonImageOnly: true
     });
  });
});

用sql创建一个数据库，并将MM/DD/YYYY格式的假日日期作为Varchar 将以下内容放入文件getdate.php中

[php]
$sql="SELECT dates FROM holidaydates";
$result = mysql_query($sql);
$chkdate = $_POST['chkdate'];
$str='';
while($row = mysql_fetch_array($result))
{
$str .=$row[0].'';
}
echo $str;
[/php]

---

快乐编码！！！！：-）

这些答案非常有用。多谢各位

我在下面的文章中添加了一个数组，其中多天可以返回false（我们每周二、周三和周四关闭）。我把具体的日期加上年份和无周末功能捆绑在一起

如果希望周末休息，请将[Saturday]、[Sunday]添加到Closedday数组中

$(document).ready(function(){

    $("#datepicker").datepicker({
        beforeShowDay: nonWorkingDates,
        numberOfMonths: 1,
        minDate: '05/01/09',
        maxDate: '+2M',
        firstDay: 1
    });

    function nonWorkingDates(date){
        var day = date.getDay(), Sunday = 0, Monday = 1, Tuesday = 2, Wednesday = 3, Thursday = 4, Friday = 5, Saturday = 6;
        var closedDates = [[7, 29, 2009], [8, 25, 2010]];
        var closedDays = [[Monday], [Tuesday]];
        for (var i = 0; i < closedDays.length; i++) {
            if (day == closedDays[i][0]) {
                return [false];
            }

        }

        for (i = 0; i < closedDates.length; i++) {
            if (date.getMonth() == closedDates[i][0] - 1 &&
            date.getDate() == closedDates[i][1] &&
            date.getFullYear() == closedDates[i][2]) {
                return [false];
            }
        }

        return [true];
    }




});

$（文档）.ready（函数（）{
$（“#日期选择器”）。日期选择器({
展会日期前：非工作日期，
月数：1，
minDate:'05/01/09'，
最大日期：'+2M'，
第一天：1
});
函数非工作日期（日期）{
var day=date.getDay（），星期日=0，星期一=1，星期二=2，星期三=3，星期四=4，星期五=5，星期六=6；
var closedDates=[[7,29,2009]、[8,25,2010]；
var closedDays=[[星期一]，[星期二]]；
对于（变量i=0；i

$（“#选择器”）.datepicker（{beforeShowDay:highlightDays}）；
...
风险值日期=[新日期（“2011年1月1日”），新日期（“2011年1月2日”）；
功能highlightDays（日期）{
对于（变量i=0；i

这里每个人都喜欢的解决方案似乎非常激烈。。。我个人认为这样做容易得多：

       var holidays = ["12/24/2012", "12/25/2012", "1/1/2013", 
            "5/27/2013", "7/4/2013", "9/2/2013", "11/28/2013", 
            "11/29/2013", "12/24/2013", "12/25/2013"];

       $( "#requestShipDate" ).datepicker({
            beforeShowDay: function(date){
                show = true;
                if(date.getDay() == 0 || date.getDay() == 6){show = false;}//No Weekends
                for (var i = 0; i < holidays.length; i++) {
                    if (new Date(holidays[i]).toString() == date.toString()) {show = false;}//No Holidays
                }
                var display = [show,'',(show)?'':'No Weekends or Holidays'];//With Fancy hover tooltip!
                return display;
            }
        });

var假日=[“2012年12月24日”、“2012年12月25日”、“2013年1月1日”，
"5/27/2013", "7/4/2013", "9/2/2013", "11/28/2013", 
"11/29/2013", "12/24/2013", "12/25/2013"];
$（“#requestShipDate”）.datepicker({
beforeShowDay:功能（日期）{
show=true；
如果（date.getDay（）==0 | | date.getDay（）==6）{show=false；}//没有周末
对于（变量i=0；i

---

这样，你的日期是人类可读的。其实并没有什么不同，只是这样对我来说更有意义。

日期选择器内置了此功能

$( "#datepicker" ).datepicker({
  beforeShowDay: $.datepicker.noWeekends
});

---

您可以使用noWeekends功能禁用周末选择

  $(function() {
     $( "#datepicker" ).datepicker({
     beforeShowDay: $.datepicker.noWeekends
     });
     });

---

在最新的Bootstrap 3版本（Bootstrap datepicker.js）中，showDay之前的

预期结果为以下格式：

{ enabled: false, classes: "class-name", tooltip: "Holiday!" }

或者，如果您不关心CSS和工具提示，只需返回布尔值
false
，即可使日期不可选择

此外，没有
$.datepicker.noWeekends
，因此您需要按照以下步骤进行操作：

var HOLIDAYS = {  // Ontario, Canada holidays
    2017: {
        1: { 1: "New Year's Day"},
        2: { 20: "Family Day" },
        4: { 17: "Easter Monday" },
        5: { 22: "Victoria Day" },
        7: { 1: "Canada Day" },
        8: { 7: "Civic Holiday" },
        9: { 4: "Labour Day" },
        10: { 9: "Thanksgiving" },
        12: { 25: "Christmas", 26: "Boxing Day"}
    }
};

function filterNonWorkingDays(date) {
    // Is it a weekend?
    if ([ 0, 6 ].indexOf(date.getDay()) >= 0)
        return { enabled: false, classes: "weekend" };
    // Is it a holiday?
    var h = HOLIDAYS;
    $.each(
        [ date.getYear() + 1900, date.getMonth() + 1, date.getDate() ], 
        function (i, x) {
            h = h[x];
            if (typeof h === "undefined")
                return false;
        }
    );
    if (h)
        return { enabled: false, classes: "holiday", tooltip: h };
    // It's a regular work day.
    return { enabled: true };
}

$("#datePicker").datepicker({ beforeShowDay: filterNonWorkingDays });

周六和周日你可以做这样的事情

             $('#orderdate').datepicker({
                               daysOfWeekDisabled: [0,6]
                 });

谢谢，在任何地方的文档中都找不到这种方法。非常好的解决方案。特别是你的解释是多么简洁@尼尔：有了这个，我得到了
uncaughttypeerror:无法读取未定义的
national days函数的属性'noWeekends'
  $(function() {
     $( "#datepicker" ).datepicker({
     beforeShowDay: $.datepicker.noWeekends
     });
     });

{ enabled: false, classes: "class-name", tooltip: "Holiday!" }

var HOLIDAYS = {  // Ontario, Canada holidays
    2017: {
        1: { 1: "New Year's Day"},
        2: { 20: "Family Day" },
        4: { 17: "Easter Monday" },
        5: { 22: "Victoria Day" },
        7: { 1: "Canada Day" },
        8: { 7: "Civic Holiday" },
        9: { 4: "Labour Day" },
        10: { 9: "Thanksgiving" },
        12: { 25: "Christmas", 26: "Boxing Day"}
    }
};

function filterNonWorkingDays(date) {
    // Is it a weekend?
    if ([ 0, 6 ].indexOf(date.getDay()) >= 0)
        return { enabled: false, classes: "weekend" };
    // Is it a holiday?
    var h = HOLIDAYS;
    $.each(
        [ date.getYear() + 1900, date.getMonth() + 1, date.getDate() ], 
        function (i, x) {
            h = h[x];
            if (typeof h === "undefined")
                return false;
        }
    );
    if (h)
        return { enabled: false, classes: "holiday", tooltip: h };
    // It's a regular work day.
    return { enabled: true };
}

$("#datePicker").datepicker({ beforeShowDay: filterNonWorkingDays });

             $('#orderdate').datepicker({
                               daysOfWeekDisabled: [0,6]
                 });