在 jquery datepicker 中启用一个特定日期
Posted
技术标签:
【中文标题】在 jquery datepicker 中启用一个特定日期【英文标题】：Enable one specific date in jquery datepicker 【发布时间】：2019-04-25 07:57:02 【问题描述】：我的网站上有一个 jQuery 日期选择器，并且每周的第一天和第二天（星期一和星期二）都禁用了。此外，我还有一系列被禁用的天数（这是有效的）。现在我也想启用 24-12-2018，但我卡在这里。
我的代码：
var vakantie = ["25-12-2018", "26-12-2018", "27-12-2018", "28-12-2018", "29-12-2018", "30-12-2018", "31-12-2018"];
function nietbeschikbaar(dt)
var datestring = jQuery.datepicker.formatDate('dd-mm-yy', dt);
return [dt.getDay() == 1 || dt.getDay() == 2 ? false : true && vakantie.indexOf(datestring) == -1];
;
jQuery("#cfgen-element-7-6").datepicker(jQuery.datepicker.regional["nl"]);
jQuery("#cfgen-element-7-6").datepicker("option", "changeMonth", true);
jQuery("#cfgen-element-7-6").datepicker("option", "changeYear", true);
jQuery("#cfgen-element-7-6").datepicker("option", "minDate", +1);
jQuery("#cfgen-element-7-6").datepicker("option", "firstDay", 1);
jQuery("#cfgen-element-7-6").datepicker("option", "dateFormat", "dd-mm-yy");
jQuery("#cfgen-element-7-6").datepicker("option", "yearRange", "-0:+70");
jQuery("#cfgen-element-7-6").datepicker("option", "beforeShowDay", nietbeschikbaar);
我还设法使此代码仅在 12 月 24 日启用，我希望启用：
var enableDays = ["24-12-2018"];
function enableAllTheseDays(date)
var sdate = $.datepicker.formatDate('dd-mm-yy', date)
if ($.inArray(sdate, enableDays) != -1)
return [true];
return [false];
jQuery("#datepicker").datepicker("option", "beforeShowDay", enableAllTheseDays);
如果可能的话，我想将这些功能结合起来。所以要求：
每周的第一天和第二天禁用 “vakantie”数组已禁用 24-12-2018（12 月 24 日）启用【问题讨论】：
嗨 charlietfl，12 月 24 日是星期一 :) 【参考方案1】：var vakantie = ["25-12-2018", "26-12-2018", "27-12-2018", "28-12-2018", "29-12-2018", "30-12-2018", "31-12-2018"];
var enableDays = ["24-12-2018"];
$("#datepicker").datepicker(beforeShowDay: function(dt)
var datestring = $.datepicker.formatDate('dd-mm-yy', dt);
if($.inArray(datestring, enableDays) != -1)
return [true];
else
return [dt.getDay() == 1 || dt.getDay() == 2 ? false : true && vakantie.indexOf(datestring) == -1 ];
);<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<p>Date: <input type="datepicker" id="datepicker"></p>
</body>试试这个..
$("#datepicker").datepicker(beforeShowDay: function(dt)
var datestring = $.datepicker.formatDate('dd-mm-yy', dt);
if($.inArray(datestring, enableDays) != -1)
return [true];
else
return [dt.getDay() == 1 || dt.getDay() == 2 ? false : true && vakantie.indexOf(datestring) == -1 ];
);
【讨论】：
是的！这是工作！非常感谢，我真的很需要这个！【参考方案2】：只需在 beforeShowDay 函数中使用以下条件。它基本上为指定日期创建了一个例外：
var override = ["24-12-2018"];
// ...
var available = (dt.getDay() == 1 || dt.getDay() == 2 || vakantie.indexOf(datestring) >= 0) && (override.indexOf(datestring) === -1)
? false
: true;
return [available];
var vakantie = ["25-12-2018", "26-12-2018", "27-12-2018", "28-12-2018", "29-12-2018", "30-12-2018", "31-12-2018"];
var override = ["24-12-2018"];
function nietbeschikbaar(dt)
var datestring = jQuery.datepicker.formatDate('dd-mm-yy', dt);
var available = (dt.getDay() == 1 || dt.getDay() == 2 || vakantie.indexOf(datestring) >= 0) && (override.indexOf(datestring) === -1)
? false
: true;
return [available];
jQuery("#cfgen-element-7-6").datepicker(jQuery.datepicker.regional["nl"]);
jQuery("#cfgen-element-7-6").datepicker("option", "changeMonth", true);
jQuery("#cfgen-element-7-6").datepicker("option", "changeYear", true);
jQuery("#cfgen-element-7-6").datepicker("option", "minDate", +1);
jQuery("#cfgen-element-7-6").datepicker("option", "firstDay", 1);
jQuery("#cfgen-element-7-6").datepicker("option", "dateFormat", "dd-mm-yy");
jQuery("#cfgen-element-7-6").datepicker("option", "yearRange", "-0:+70");
jQuery("#cfgen-element-7-6").datepicker("option", "beforeShowDay", nietbeschikbaar);@import url("https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/blitzer/jquery-ui.min.css");<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<p>Navigate to December 2018</p>
<p><input id="cfgen-element-7-6"></p>【讨论】：
感谢您的回答，很遗憾我无法正常工作。 Sooriya 的回答对我有用。以上是关于在 jquery datepicker 中启用一个特定日期的主要内容，如果未能解决你的问题，请参考以下文章
Jquery Datepicker - 从 mysql 数据库启用日期
yii 框架 - 当我在表单中启用 ClientValidation 时，jquery datepicker 不起作用
jQuery UI Datepicker 仅启用数组中的特定日期
jQuery DatePicker - 启用特定日期 - 代码不起作用