Jquery UI Datepicker 显示其他禁用日期

Question

我正在尝试显示日期选择器的其他禁用日期。例如，我的最小日期为2-1-2018，最大日期为3-1-2018。有没有办法将1-1-2018 和4-1-2018 显示为禁用？这是我现在所拥有的。我不需要动态设置日期。我需要显示更多的禁用日期，以便用户可以看到更大范围的禁用日期。

             beforeShow : function () {

             if (attrs.selecteddate) {
                 /*
                  2018-10-29T00:00:00.000+0000 before
                  2018-10-29 after
                  Only need the 00-00-0000 part of the date to avoid time zone issues. QoT always returns 00T for timezone anyways. 
                 */
                 var formattedDate = attrs.selecteddate.split("T");
                 attrs["formattedDate"] = formattedDate[0].substring(5) + "-" + formattedDate[0].substring(0, 4);
                 /*z
                 Set the date that the calander will display.
                 Append universal date time zone so correct date will be set in Firefox. It replaces T00:00:00.000+0000 with T12:00:00Z
                 */
                 jQuery(this).datepicker('setDate', new Date(formattedDate[0] + 'T12:00:00Z')); 
             }

            jQuery(this).datepicker('option', {
               minDate : ( attrs.edittype === 'single' ) ? incrementDate(attrs.mindate) : attrs.mindate,
               maxDate : ( attrs.edittype === 'single' ) ? convertToDateObj(attrs.maxdate) : attrs.maxdate
            });
         },

Answer 1

以下 js 代码将帮助您动态更改最小和最大日期。

$(function(){

$("#fdate").datepicker({
				formatDate:"dd-mm-yy",
				onselect:function(){
				  //do stuff here
				},
				onclose:function(){
				//do stuff here
				}
		});
		
var date1 = "15-11-2017";
var date2 = "17-11-2017"; //you can pass dynamically date

$("#fdate").datepicker("option", "minDate", date1);
$("#fdate").datepicker("option", "maxDate", date2);
});

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

<input id="fdate" type="text" name="date" />