Question

我使用此代码禁用日期并允许仅选择星期一，但现在我需要启用一年中的某些特定日期：

$(function(){

  $( "#fecha" ).datepicker({
    minDate: 0,
    maxDate: "+3M",
    dateFormat: 'yy-mm-dd',
    beforeShowDay: function (date) {
      if (date.getDay() == 1) {
        return [true, ''];
      } else {
        return [false, ''];
      }
    }
  });

  $( "#fecha2" ).datepicker({
    minDate: 0,
    maxDate: "+3M",
    dateFormat: 'yy-mm-dd',
    beforeShowDay: function (date) {
      if (date.getDay() == 1) {
        return [true, ''];
      } else {
        return [false, ''];
      }
    }
  });

});

我需要启用2017年7月20日（2017年7月20日）的特定日期。

Answer 1

这样做。这将采用数组中的特定日期来启用它们，并将星期一显示为已启用。

＆＃13;

var availableDates = ["9-5-2017","14-5-2017","15-5-2017"];

function available(date) {
  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
  if ($.inArray(dmy, availableDates) != -1) {
    return [true, "","Available"];
  } else {
  	if (date.getDay() == 1) {
      return [true, ''];
    } else {
      return [false,"","unAvailable"];
    }
  }
}

$('#date').datepicker({ beforeShowDay: available });

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<input type="text" name="date" id="date" readonly="readonly" size="12" />

＆＃13;

Answer 2

我和@gaganshera有类似的答案。

与允许的日期数组的日期比较是不同的，但结果是相同的。

另见CodePen

＆＃13;

$(function(){

  // Human readable date array
  var allowedDays = ["2017-05-25", "2017-06-16", "2017-07-21"];
  
  // Same array as Date objects
  var allowed = [];
  $.each(allowedDays,function(i,val){
    allowed[i] = new Date(val+" 0:00");
  });
  
  // Define options
  var dapickerOptions = {
    minDate: 0,
    maxDate: "+3M",
    dateFormat: 'yy-mm-dd',
    beforeShowDay: function (date) {
      
      // If an allowed date
      if(JSON.stringify(allowed).indexOf(date.toISOString())!=-1){
        return [true, 'orange'];
      }
      
      // If a monday
      if (date.getDay() == 1) {
        return [true, 'green'];
        
      } else {
        return [false, ''];
      }
    }
  };
  
  // Initiate the datePickers
  $( "#fecha" ).datepicker(dapickerOptions);
  $( "#fecha2" ).datepicker(dapickerOptions);

}); // ready

＆＃13;

.green a{
  background-color:green !important;
}
.orange a{
  background-color:orange !important;
}

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<input id="fecha"><br>
<br>
<input id="fecha2"><br>

＆＃13;

如何在禁用某些天后启用一天？

2 个答案: