Jquery UI Datepicker:首先高亮显示



如果var express为true,我想为前3个可选择的天添加一个类。

下面的代码可以工作,但是如果我选择一个被删除的类的日期

$datepicker.datepicker({
        dayNamesMin: ["S", "M", "D", "M", "D", "F", "S"],
        beforeShowDay:$.datepicker.noWeekends,
        firstDay: 1,
        minDate: d,
        dateFormat: "dd.mm.yy",
        onSelect: function (dateText, inst) {
            $('.delivery-date').text(dateText);
            var printReleaseDateParts =dateText.split('.');
            var printReleaseDate = new Date(printReleaseDateParts[2],printReleaseDateParts[1]-1,printReleaseDateParts[0]);
            printReleaseDate.setDate(printReleaseDate.getDate() - printRelease);
            $('.print-release-date').text($.datepicker.formatDate('dd.mm.yy', printReleaseDate));
            $datepicker.removeClass('express');
            if (express) {
                $datepicker.addClass('express');
                $('*[data-handler="selectDay"]:lt(3)').addClass('express');
            } else {
                $datepicker.removeClass('express');
                $('*[data-handler="selectDay"]:lt(3)').removeClass('express');
            }
        },
        onChangeMonthYear: function(){
            console.log('onChangeMonthYear');
        }
    });

var express是通过复选框设置的。最后,如果复选框被选中,用户应该能够选择一个突出显示的快递交货日期。快件送达日期为正常起始第一个可选日的前3天。第一个可选择的日期由change

上的复选框更改。
$('input:checkbox[name=option-express]').change(function () {
            if ($(this).prop("checked") == true) {
                $datepicker.addClass('express');
                var d = calculateMinDate(deliveryExpress);
                $datepicker.datepicker("option", "minDate", d);
                $('*[data-handler="selectDay"]:lt(3)').addClass('express');
                express = true;

            } else {
                $datepicker.removeClass('express');
                var d = calculateMinDate(deliveryRegular);
                $datepicker.datepicker("option", "minDate", d);
                $('*[data-andler="selectDay"]:lt(3)').removeClass('express');
                express = false;
            }
        });

只应突出显示工作日。

那么,什么是突出第一天的最佳实践呢?

编辑:

现在我实现了beforeShowDay的自定义函数,但没有运气。console.log被触发了四次,但是没有添加类。

var expressDates = ["08/29/2016", "08/30/2016", "08/31/2016", "09/01/2016"];
function expressDays(date) {
            var noWeekend = $.datepicker.noWeekends(date);
            if (noWeekend[0] && express) {
                for (var i = 0; i < expressDates.length; i++) {
                    if (new Date(expressDates[i]).toString() == date.toString()) {
                        console.log('express day!')
                        return [true, 'express', 'Express'];
                    }
                }
                return [true, ''];
            } else {
                return noWeekend;
            }
        }

好吧,我自己弄明白了。我修改了beforeShowDay的函数。我把我的明确日期在一个数组和检查它与$.inArray()

function expressDays(date) {
            var noWeekend = $.datepicker.noWeekends(date);
            var expressDates = [];
            for (var i = 0; i < deliveryExpress-1; i++) {
                expressDates.push(moment($datepicker.datepicker("option", "minDate")).businessAdd(i).format('L'))
            }
            if (noWeekend[0] && express) {
                var dateString = $.datepicker.formatDate('mm/dd/yy', date);
                if($.inArray(dateString,expressDates) >=0){
                    return [true, 'express', 'Express'];
                }else{
                    return [true, 'noexpress'];
                }
            } else {
                return noWeekend;
            }
        }

相关内容

  • 没有找到相关文章

最新更新