使用jQuery DateTimePicker禁用特定日期的特定时间
使用jQuery DateTimePicker禁用特定日期的特定时间
提问于 2022-04-26 12:45:08
我试图使用jQuery DateTimePicker来禁用特定日期的特定时间，如下所示：
jQuery('#datetimepicker').datetimepicker({
disabledDates: ['27/04/2022 14:00'],
format:'d/m/Y H:i'
});然而，这是行不通的。我只能在每一天禁用的特定时间，或者禁用特定的日期。
回答 3
Stack Overflow用户
回答已采纳
发布于 2022-04-27 11:57:29
好的，我自己想办法弄清楚了。我正在使用PHP，但基本上可以使用任何多维数组并对其进行JSON编码。
$times[]=[
'2022-04-28'=>[
'hour' => 10,
'minute' => 30
]
];
$times[]=[
'2022-04-28'=>[
'hour' => 11,
'minute' => 15
]
];
$times[]=[
'2022-04-29'=>[
'hour' => 13,
'minute' => 30
]
];
$dates=json_encode($times);一旦您有了日期和时间列表，就可以使用onGenerate()函数循环您的日期，并将禁用的类添加到特定的时间。
jQuery('#datetimepicker').datetimepicker({
lang:'en',
format:'Y-m-d H:i',
formatDate:'Y-m-d',
step:15,
onGenerate: function(ct, $i){
var date=moment(ct).format('Y-MM-D');
var datesArray=<?echo $dates;?>;
$.each(datesArray, function(i, dates){
if(date in dates){
var times=dates[date];
$.each(times, function(index, time){
var hour=times['hour'];
var minute=times['minute'];
var $object=$('[data-hour="' + hour + '"][data-minute="' + minute + '"]');
$object.addClass('xdsoft_disabled');
});
}
});
}
});请注意：，您需要为数组和jQuery函数使用完全相同的日期格式。另外，我的步骤被设置为15分钟的增量。所以这只会使这一步失效。
Stack Overflow用户
发布于 2022-04-26 13:05:01
这是因为jQuery插件DateTimePicker的"disabledDates“只接受和禁用天。https://xdsoft.net/jqplugins/datetimepicker/
似乎没有这样的选项来禁用特定的时间，您可以使用https://xdsoft.net/jqplugins/datetimepicker/#allowTimes只启用特定的时间。
jQuery('#datetimepicker').datetimepicker({
datepicker:false,
allowTimes:[
'01:00', '02:00', '03:00',
'04:00', ... , '15:00', '60:00'
]
});如果您想继续使用jQuery DateTimePicker，您必须为它编写自己的函数。
jQuery('#datetimepicker').datetimepicker({
format:'d.m.Y H:i',
timepicker: true,
lang: 'en',
onGenerate:function(ct,$i){
//some function here to disable certain times
});
}
}
});或者您可以使用Bootstrap，它可以选择做您想做的事情，https://getdatepicker.com/4/Options/#endisabledhours
Stack Overflow用户
发布于 2022-04-26 13:09:51
试试这个参考文献
$(function () {
var disabledDate = ['2020-07-14', '2020-07-15','2020-07-16'];
$('#datetimepickerDemo').datetimepicker({
disabledDates: disabledDate
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/72014215
复制相关文章
相似问题
腾讯云开发者
