我一直在我网站的一部分上使用这个 DateTime 选择器,我有一个每周的时间表,它的开始和结束时间取决于一周中的哪一天,我想禁用超出时间表范围的时间和包括分钟,我有什么惊喜?我找不到任何有关禁用分钟的文档。我决定将 DateTime 插件更改为另一个插件,但我必须更改我已经拥有的所有代码。所以我回到 [eonasdan-datetimepicker] 有什么办法可以完成这项工作吗?我能够成功禁用小时,但我说的是分钟。
问问题
1046 次
2 回答
0
您可以使用选项disabledTimeIntervals但这仅适用于特定日期(时刻),然后您必须指定每个可用日期的时间间隔。我做了这样的事情:
var addingColacionInterval = function (disabledTimeIntervals, currDate) {
var intervalsPerDay = {
1: { //1-7 where 1 is Monday and 7 is Sunday
startHour:15,
startMinute: 40,
durationInMinutes: 30
},
2: {
startHour:8,
startMinute: 20,
durationInMinutes: 50
}
// etc
}
var intervalForWeekDay = intervalPerDay[currDate.isoWeekday()]; //.isoWeekday(); // returns 1-7 where 1 is Monday and 7 is Sunday
var initialTime = currDate.clone().set({ hour: intervalForWeekDay.startHour, minute: intervalForWeekDay.startMinute });
disabledTimeIntervals.push([initialTime, initialTime.clone().add(parseInt(intervalForWeekDay.durationInMinutes), 'minutes')]);
}
var minDate = moment("the min selectable date");
var maxDate = moment("the max allowed date");
//for disable colación minutes intervals we can't use disableHours because don't work with minutes disabledTimeIntervals doesn't work for all days (like, but you have to loop trought
var disabledTimeIntervals = [];
var currDate = minDate.clone().startOf('day');
var lastDate = maxDate.clone().endOf('day');
do {
addingColacionInterval(disabledTimeIntervals, currDate);
} while (currDate.add(1, 'days').diff(lastDate) < 0);
var disabledHours = [0, 1, 2, 3, 4, 5, 6, 7, 23];
$scope.disableDays = [];
if ($scope.import.disableSunday) {
$scope.disableDays = [0];
}
//
$scope.dateSecOptions = {
minDate: minDate.format('YYYY-MM-DD'),
maxDate: maxDate.format('YYYY-MM-DD'),
disabledHours: disabledHours,
disabledTimeIntervals: disabledTimeIntervals,
stepping: 10,
};
与 disabledTimeIntervals 相比,还存在选项 disabledHours,它允许您禁用日历小部件中所有可用(可选)天的小时数。
于 2017-05-29T15:02:09.757 回答
-1
你到底想要什么?例如只允许用户选择特定时间,例如半小时 [30] 或整小时?[00] 因为如果是这种情况,您可以使用步进功能,它的作用是当用户选择向上或向下箭头时,分钟会根据您的选择提前,例如 30 分钟:
$(document).ready(function () {
$('#datetimepicker4').datetimepicker({
stepping:30
});
});
于 2016-08-04T19:43:34.783 回答