Javascript 基于条件检查禁用日期的js代码

当用户从“可用日期”中选择日期时，“过期日期”字段中将显示24天，后跟“可用日期”中选择的日期，周六和周日日期将被禁用。请查找演示

我面临以下两个要求的困难

1） 当用户在可用日期字段中选择日期时，到期日期字段应启用除周六和周日之外的24天日期，并且不应显示今天之后的日期。即，如果用户选择2017-05-11作为可用日期，则在到期日期中，应启用2017-05-11至2017-05-19的日期（周六和周日被禁用）

2） 到期日期字段应禁用，当用户在可用日期字段中选择日期时，则只应启用到期日期字段，并且允许用户选择日期

js代码：

var demoApp = angular.module('demoApp', ["ui.bootstrap"]);

// create angular controller
demoApp.controller("demoController", ["$scope",
    function($scope) {
        var today = new Date();
        $scope.AvailableDate = new Date();
        $scope.ExpireDate = new Date();
        $scope.dateFormat = 'yyyy-MM-dd';
        $scope.availableDateOptions = {
            formatYear: 'yy',
            startingDay: 1,
            minDate: "2016-03-12",
            maxDate: today,
               dateDisabled: function(data) {
                var date = data.date;
                var mode = data.mode;
               return (mode === 'day' && ( date.getDay() === 0 || date.getDay() === 6 ));
            }

        };
        $scope.expireDateOptions = {
            formatYear: 'yy',
            startingDay: 1,
            minDate: today,
            maxDate: "2017-06-12",
            dateDisabled: function(data) {
                var date = data.date;
                var mode = data.mode;
               return (mode === 'day' && ( date.getDay() === 0 || date.getDay() === 6 ));
            }
        };
        $scope.availableDatePopup = {
            opened: false
        };
        $scope.expireDatePopup = {
            opened: false
        };
        $scope.ChangeExpiryMinDate = function(availableDate) {
            if (availableDate != null) {
                var availableDate = new Date(availableDate);
                var expiryMinDate = angular.copy(availableDate);
                expiryMinDate.setDate(expiryMinDate.getDate() + 28);

                $scope.ExpireDate = availableDate;
                $scope.expireDateOptions.minDate = availableDate;
                $scope.expireDateOptions.maxDate = expiryMinDate;
            } else {
                delete $scope.ExpireDate;
            }
        };
        $scope.ChangeExpiryMinDate($scope.AvailableDate);
        $scope.OpenAvailableDate = function() {
            $scope.availableDatePopup.opened = !$scope.availableDatePopup.opened;
        };
        $scope.OpenExpireDate = function() {
            $scope.expireDatePopup.opened = !$scope.expireDatePopup.opened;
        };
    }
]);

---

通过使用

ng disabled

，您可以检查是否首先设置了可用日期

ng-disabled="!AvailableDate"

但是，您也在控制器中预先选择了今天的日期，因此在用户选择之前会预先填充AvailableDate。删除此选项意味着用户必须选择一个可用日期，您不必通过调用来计算初始过期日期：

$scope.ChangeExpiryMinDate（$scope.AvailableDate）

要求是：


有效期通常为有效期+24天
但是，如果超过今天的日期，则到期日期为今天的日期

我们可以使用计算较小的日期：今天的日期或可用日期+24天的潜在计算日期：

expiryMinDate = new Date(Math.min(expiryMinDate.setDate(expiryMinDate.getDate() + 23), new Date())); 

我在这里创建了一个示例：
您的示例：“如果用户选择2017-05-11作为可用日期，则在到期日期中，应启用从2017-05-11到2017-05-19的日期”不符合您的要求。不应该是2017-06-02吗？您的示例JSFIDLE不起作用，抛出js异常。我的另一个要求是，当用户在Available date 24 days（星期六和星期日除外）中选择日期时，应在Expired date（过期日期）字段中启用，并且不应超过今天的日期。例如，如果用户在“可用日期”中选择2017-05-15，则在“过期日期”字段中，直到今天为止，应启用日期。谢谢。您好。我相信你的要求很容易解决，但我发现很难理解。你能举个例子吗：如果我选择2017-02-01。“到期日期”字段中启用了哪些日期？如果我选择了2017-02-01，“到期日期”字段应在接下来的24天内启用。如果用户选择2017-05-05，那么在到期日期字段中，它应该只启用到今天，因为今天的日期之后是24天，而在到期日期字段中，日期字段在今天之后不应该启用，希望你明白我的意思。谢谢@user2340824我现在完全明白了！我已经更新了我的示例。谢谢，它正在工作。感谢您的帮助@user2340824