Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/77.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Jquery UI日历-如何突出显示当前日期后的天数?_Javascript_Jquery_Html_Jquery Ui - Fatal编程技术网

Javascript Jquery UI日历-如何突出显示当前日期后的天数?

Javascript Jquery UI日历-如何突出显示当前日期后的天数?,javascript,jquery,html,jquery-ui,Javascript,Jquery,Html,Jquery Ui,我在一个客户网站上工作,在我使用的网站上,我需要能够突出显示从当前日期后2天开始的3个工作日,但合并数学以不计算周末。这是我的小提琴: 这是HTML <input type="text" id='datepicker'> 我在向上面的代码添加之前遇到问题:$.datepicker.noWeekends。我还需要突出显示的3个日期是可变的,因此它们会根据当前日期的不同而变化,但我仍在学习JS,我不理解其背后的逻辑 我已经浏览了这个网站和其他网站,虽然有很多关于如何突出具体日期的问题

我在一个客户网站上工作,在我使用的网站上,我需要能够突出显示从当前日期后2天开始的3个工作日,但合并数学以不计算周末。这是我的小提琴:

这是HTML

<input type="text" id='datepicker'>
我在向上面的代码添加
之前遇到问题:$.datepicker.noWeekends
。我还需要突出显示的3个日期是可变的,因此它们会根据当前日期的不同而变化,但我仍在学习JS,我不理解其背后的逻辑

我已经浏览了这个网站和其他网站,虽然有很多关于如何突出具体日期的问题/答案,但没有一个完全适用于我正在尝试做的事情


因此,为了澄清这一点,我需要做一些数学运算,找出如何否定正念和周末,并突出接下来的三个工作日。

更新

以下是一种方法:

var currentDay = new Date();
    var dayOfWeek;
    var highlighted = 0;
    var count = 0;
    var SelectedDates = {};

    while(highlighted < 3){
       dayOfWeek = currentDay.getDay();
        if(dayOfWeek != 0 && dayOfWeek != 6){
            if(count > 1){
                alert(currentDay);
                var month = currentDay.getMonth()+1;
                if(month.toString().length < 2)
                    month = '0'+month;
                var day = currentDay.getDate();
                if(day.toString().length < 2)
                    day = '0'+day;
                var year = currentDay.getFullYear();
                var dateStr = month+"/"+day+"/"+year;   
                SelectedDates[new Date(dateStr)] = new Date(dateStr);
                highlighted++;
            }
            else {
                count++;    
            }
        }
        currentDay = new Date(currentDay.getTime() + (24 * 60 * 60 * 1000));    
    }
var currentDay=新日期();
var dayOfWeek;
var=0;
var计数=0;
var SelectedDates={};
while(突出显示<3){
dayOfWeek=currentDay.getDay();
if(dayOfWeek!=0&&dayOfWeek!=6){
如果(计数>1){
警报(当前日期);
var month=currentDay.getMonth()+1;
如果(月toString().长度<2)
月份='0'+月份;
var day=currentDay.getDate();
如果(day.toString().length<2)
天='0'+天;
var year=currentDay.getFullYear();
var dateStr=月+“/”+日+“/”+年;
所选日期[新日期(dateStr)]=新日期(dateStr);
突出显示++;
}
否则{
计数++;
}
}
currentDay=新日期(currentDay.getTime()+(24*60*60*1000));
}
例如:

这应该可以做到:

$(document).ready(function () {
    var css, count = 0,
        gap = 0,
        today = new Date();
    $('#datepicker').datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        minDate: 2,
        maxDate: "+4M +15D",
        beforeShowDay: function (date) {
            var day = date.getDay();
            var diff = new Date(date - today);
            var numDays = Math.ceil(diff / 1000 / 60 / 60 / 24);
            if (numDays > 0 && count < 3) {
                if (day != 6 && day != 0) {
                    gap++;
                    if (gap > 1) {
                        count++;
                        css = 'Highlighted';
                    } else css = '';
                }
            } else css = '';
            return [(day != 6) && (day != 0), css]; //0-Sunday 6-Saturday
        },
        onSelect: function () {
            count = 0;
            gap = 0;
        }
    });
});
$(文档).ready(函数(){
变量css,计数=0,
差距=0,
今天=新日期();
$(“#日期选择器”)。日期选择器({
showOtherMonths:是的,
选择OtherMonths:true,
minDate:2,
最大日期:“+4M+15D”,
beforeShowDay:功能(日期){
var day=date.getDay();
var diff=新日期(日期-今天);
var numDays=数学单元(diff/1000/60/60/24);
如果(numDays>0&&count<3){
如果(天!=6&&day!=0){
gap++;
如果(间隙>1){
计数++;
css='突出显示';
}else css='';
}
}else css='';
return[(day!=6)&(day!=0),css];//0-星期日6-星期六
},
onSelect:function(){
计数=0;
差距=0;
}
});
});

为什么minDate设置为2?这会阻止某人选择明天。因为他们选择的日期是发货日期,而minDate:2基本上是处理时间。您希望突出显示星期五、星期一和星期二(今天是星期四),还是像小提琴一样突出显示星期一、星期二和星期三?你的问题是“当前日期后3个工作日”,但这与小提琴的例子不符。你能看看并告诉我这是否接近你想要的吗?这是怎么回事?您可以通过更改行
today=newdate(),用其他日期对其进行测试。例如,4月20日将是
today=新日期(2014,3,20)(月份以零为基础)。让我知道这是否是你所需要的,如果是的话,我会把它作为一个答案发布。我刚刚意识到,如果今天不是周末,你可能也想把今天算为一个工作日。我将更新我的帖子。@MatthewSechrest检查我的更新。不管是哪一天,它都会为你工作。好的,这很好!因此,如果当前日期是星期三,那么突出显示的日期会是星期五、星期一和星期二吗?@MatthewSechrest是的,看看这个模拟示例,注意您的代码行minDate:2被注释掉了。取消注释那一行,看看会发生什么。不管怎样,当你取消注释那一行时,星期五是灰色的,但那只是因为今天实际上是星期四。但如果它实际上是周三,那么它就不会变灰。所以不用担心。
$(document).ready(function () {
    var css, count = 0,
        gap = 0,
        today = new Date();
    $('#datepicker').datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        minDate: 2,
        maxDate: "+4M +15D",
        beforeShowDay: function (date) {
            var day = date.getDay();
            var diff = new Date(date - today);
            var numDays = Math.ceil(diff / 1000 / 60 / 60 / 24);
            if (numDays > 0 && count < 3) {
                if (day != 6 && day != 0) {
                    gap++;
                    if (gap > 1) {
                        count++;
                        css = 'Highlighted';
                    } else css = '';
                }
            } else css = '';
            return [(day != 6) && (day != 0), css]; //0-Sunday 6-Saturday
        },
        onSelect: function () {
            count = 0;
            gap = 0;
        }
    });
});