无法使用jquery在datepicker中选择其他日期

Question

我是这里的新手，我将开始日期设置为+60 D，但对于为什么我不能选择其他日期感到困惑，我的计划是将默认日期范围设置为+ 60D，因此我可以选择进一步的日期。这是示例链接http://jsfiddle.net/jquerybyexample/LGw6F/

From: <input type="text" id="txtFromDate" />
To: <input type="text" id="txtToDate" />


$(document).ready(function(){
    $("#txtFromDate").datepicker({
        minDate: 0,
        maxDate: "+60D",
        numberOfMonths: 2,
        onSelect: function(selected) {
          $("#txtToDate").datepicker("option","minDate", selected)
        }
    });
    $("#txtToDate").datepicker({ 
        minDate: 0,
        maxDate:"+60D",
        numberOfMonths: 2,
        onSelect: function(selected) {
           $("#txtFromDate").datepicker("option","maxDate", selected)
        }
    });  
});

Answer 1

根据最新评论再次更新。

更新了jFiddle（ http://jsfiddle.net/LGw6F/2230/ ）

$(document).ready(function(){
   $("#txtFromDate").datepicker({ 
    dateFormat: 'yy-mm-dd',
    changeMonth: true,
    minDate: new Date(),
    numberOfMonths: 2,
    onSelect: function(selected) {
          $("#txtToDate").datepicker("option","minDate",selected);
          var  selectedDate = $("#txtFromDate").datepicker("getDate");
          var msecsInADay = 5184000000;
          var endDate = new Date(selectedDate.getTime() + msecsInADay);
          $("#txtToDate").datepicker("option","maxDate",endDate);

        }
  });

  $("#txtToDate").datepicker({ 
      dateFormat: 'yy-mm-dd',
      numberOfMonths: 2,
  });
});

Answer 2

要预填充您的输入字段（“输入默认日期”），请执行以下操作：

 $(function(){ $("#txtFromDate").datepicker({ minDate:0, maxDate: "+60D", numberOfMonths: 2, }); $("#txtToDate").datepicker({ minDate:0, maxDate:"+60D", numberOfMonths: 2, }); var default_date = new Date(); default_date.setDate(default_date.getDate()+60); $('#txtFromDate').datepicker('setDate', new Date()); $('#txtToDate').datepicker('setDate', default_date); }); $("#txtFromDate").datepicker({ onSelect: function(dateText) { $("#txtToDate").datepicker("option", "minDate", $('#txtFromDate').datepicker("getDate") ); var date2 = $("#txtFromDate").datepicker("getDate"); date2.setDate(date2.getDate()+60); $("#txtToDate").datepicker("option", "maxDate", date2); } }); 

 body { font-size:8pt; font-family:Verdana; padding: 5px; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <br/> From: <input type="text" id="txtFromDate" /> To: <input type="text" id="txtToDate" /> <!-- begin snippet: js hide: false console: true babel: false --> 

完整的HTML示例：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Test</title> <style> body { font-size:8pt; font-family:Verdana; padding: 5px; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> </head> <body> <br/> From: <input type="text" id="txtFromDate" /> To: <input type="text" id="txtToDate" /> <script type="text/javascript"> $(function(){ $("#txtFromDate").datepicker({ minDate:0, maxDate: "+60D", numberOfMonths: 2, }); $("#txtToDate").datepicker({ minDate:0, maxDate:"+60D", numberOfMonths: 2, }); var default_date = new Date(); default_date.setDate(default_date.getDate()+60); $('#txtFromDate').datepicker('setDate', new Date()); $('#txtToDate').datepicker('setDate', default_date); }); $("#txtFromDate").datepicker({ onSelect: function(dateText) { $("#txtToDate").datepicker("option", "minDate", $('#txtFromDate').datepicker("getDate") ); var date2 = $("#txtFromDate").datepicker("getDate"); date2.setDate(date2.getDate()+60); $("#txtToDate").datepicker("option", "maxDate", date2); } }); </script> </body> </html> 

我希望这就是你想要的。 问候