Question

我正在使用这个Jquery datepicker代码。我想要做的是当我点击任何其他日期时，将当前突出显示日期的颜色更改为灰色，并将所点击日期的颜色更改为绿色。

棘手的部分是，只有灰色的那些可以变成绿色而反之，但没有其他日期可以在点击时变成绿色。

我不明白我做错了什么。或者是我的代码是完全错误的。如果有人可以帮忙。

这是代码

$(function() {
     var togo=['10/25/2013']
     var datesArray=['10/27/2013','10/28/2013']
     var datesArray1=['10/25/2013','10/26/2013']
     var datesArray2=['10/24/2013']


        $( "#datepicker" ).datepicker({
            numberOfMonths: 2,

            selectMultiple:true,
            beforeShowDay: function (date) {
                var theday = (date.getMonth()+1) +'/'+ 
                            date.getDate()+ '/' + 
                            date.getFullYear();
                    return [true,$.inArray(theday, datesArray2) >=0?"specialDate":($.inArray(theday, datesArray)>=0?"specialDate2":($.inArray(theday, datesArray1)>=0?"specialDate1":''))];
                },

            onSelect: function(date){

             console.log("clicked"+date);  
            return [true,$.inArray(date, togo) >=0?"specialDate":($.inArray(date, datesArray1)>=0?"specialDate1":'')] ;  

            }

        });
        //$.inArray(theday, datesArray) >=0?"specialDate":'specialDate1'
    });

为了更清楚地了解我正在做什么以及我想要什么，这是一个JSFiddle

http://jsfiddle.net/pratik24/Kyt2w/3/

感谢。

Answer 1

onSelect的行为与beforeShowDay不同。您无法使用[true/false, class, popup]返回数组。相反，您必须在函数中手动应用该类。

我不确定你要做什么，但我会重新安排你的代码。我用灰色日期做了一个数组，然后用绿色日期做了一个变量。我从不更改数组，但在点击时更新绿色日期，然后在refresh上调用datepicker：

$(function () {
    var togo = [ '10/25/2013' ];
    var redDates = [ '10/27/2013', '10/28/2013' ];
    var grayDates = [ '10/24/2013', '10/25/2013', '10/26/2013' ];
    var greenDate = '10/24/2013';


    $("#datepicker").datepicker({
        numberOfMonths: 2,

        selectMultiple: true,
        beforeShowDay: function (date) {
            var theday = (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();
            return [true, greenDate == theday ? "specialDate" : ($.inArray(theday, redDates) >= 0 ? "specialDate2" : ($.inArray(theday, grayDates) >= 0 ? "specialDate1" : ""))];
        },

        onSelect: function (dateStr) {
            var date = new Date(dateStr);
            var theday = (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();

            if ($.inArray(theday, grayDates) >= 0) {
                greenDate = theday;
            }
            $('#datepicker').datepicker("refresh");
        }

    });
});

我不确定togo的用途，但这应该让你开始。

演示：http://jsfiddle.net/xU47h/3/

Jquery DatePicker在特定日期的选择上更改突出显示的颜色

1 个答案: