jQuery datepicker以防止過去日期

Question

如何禁用jQuery datepicker上的過去日期？我尋找選項，但似乎沒有發現任何能夠禁用過去日期的功能。

更新：謝謝你的快速反應。我試過沒有運氣。天仍然沒有像我預期的那樣變灰，並且仍然接受選定的過去的日期。

我嘗試這樣做：

$('#datepicker').datepicker({ minDate: '0' }); 

不工作。

我嘗試這樣做：

$('#datepicker').datepicker({ minDate: new Date() }); 

不過也不起作用。

它顯示日曆小部件就好了。它不會變灰或阻止過去幾天的輸入。我曾嘗試在過去沒有運氣的minDate和maxDate，所以我認爲它不應該是他們。

Answer 1

使用minDate選項設置最小可能日期。 http://jqueryui.com/demos/datepicker/#option-minDate

Answer 2

您只需要指定一個最短日期 - 將其設置爲0意味着最低日期是從今天即今天起的0天。您可以改爲傳遞字符串'0d'（默認單位是天）。

$(function() { 
    $('#date').datepicker({ minDate: 0 }); 
}); 

Answer 3

嘗試將startDate設置爲當前日期。例如：

$('.date-pick').datePicker({startDate:'01/01/1996'}); 

Answer 4

試試這個：

$("#datepicker").datepicker({ minDate: 0 }); 

從0刪除引號。

Answer 5

這工作：

$("#datepicker").datepicker({ minDate: +0 }); 

Answer 6

我使用下面的代碼來格式化日期和顯示的日曆2個月〜

<script> 
$(function() { 

    var dates = $("#from, #to").datepicker({ 

     showOn: "button", 
     buttonImage: "imgs/calendar-month.png", 
     buttonImageOnly: true,       
     defaultDate: "+1w", 
     changeMonth: true, 
     numberOfMonths: 2, 

     onSelect: function(selectedDate) { 




      $(".selector").datepicker({ defaultDate: +7 }); 
      var option = this.id == "from" ? "minDate" : "maxDate", 


       instance = $(this).data("datepicker"), 
       date = $.datepicker.parseDate(
        instance.settings.dateFormat || 
        $.datepicker._defaults.dateFormat, 
        selectedDate, instance.settings); 

      dates.not(this).datepicker("option", "dateFormat", 'yy-mm-dd'); 


     } 
    }); 
}); 

</script> 

的問題是我不知道如何限制之前的日期選擇。

Answer 7

刪除有關0的報價，它將起作用。

工作代碼段：

// set minDate to 0 for today's date 
 
$('#datepicker').datepicker({ minDate: 0 });

body { 
 
    font-size: 12px; /* just so that it doesn't default to 16px (which is kinda huge) */ 
 
}

<!-- load jQuery and jQuery UI --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> 
 

 
<!-- load jQuery UI CSS theme --> 
 
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> 
 

 
<!-- the datepicker input --> 
 
<input type='text' id='datepicker' placeholder='Select date' />

Answer 8

確保你把多個屬性在同一行（因爲你只顯示1行代碼，你可能也遇到了同樣的問題我做到了）。

礦將設置默認日期，但沒有灰掉舊日期。這不起作用：

$('#date_end').datepicker({ defaultDate: +31 }) 
$('#date_end').datepicker({ minDate: 1 }) 

這做兩件事：

$('#date_end').datepicker({ defaultDate: +31, minDate: 1 }) 

1和+1的工作相同（或0 + 0和你的情況）。

我：Windows 7的64位，Rails的3.2.3，1.9.3紅寶石

Answer 9

如果你正在處理一個以前綁定的日期選擇器，然後設置

$("#datepicker").datepicker({ minDate: 0 }); 

將無法​​正常工作。該語法僅適用於您創建小部件的情況。

設定分鐘日期爲綁定日期選擇器使用以下命令：

$("#datePicker").datepicker("option", "minDate", 0); 

Answer 10

var givenStartDate = $('#startDate').val(); 
     alert('START DATE'+givenStartDate); 
     var givenEndDate = $('#endDate').val(); 
     alert('END DATE'+givenEndDate); 
     var date = new Date(); 
     var month = date.getMonth()+1; 
     var day = date.getDate(); 
     var currentDate = date.getFullYear() + '-' + 
      (month<10 ? '0' : '') + month + '-' + 
      (day<10 ? '0' : '') + day; 
     if(givenStartDate < currentDate || givenEndDate < currentDate) 
     { 
     $("#updateButton").attr("disabled","disabled"); 
     } 
     if(givenStartDate < currentDate && givenEndDate > currentDate) 
      { 
      $("#updateButton").attr("enabled","enabled"); 
      } 
     if(givenStartDate > currentDate || givenEndDate > currentDate) { 
     $("#updateButton").attr("enabled","enabled"); 
     } 

試試這個。如果有任何錯誤，請糾正我:)謝謝大家。

Answer 11

給予零解釋，它會消除過去的日期。

$("#datepicker").datepicker({ minDate: 0}); 

Live example

read more here

Answer 12

//禁用將來的日期

$('#datetimepicker1').datetimepicker({ 
      format: 'DD-MM-YYYY', 
      maxDate: new Date 
     }); 

//禁用過去的日期

$('#datetimepicker2').datetimepicker({ 
     format: 'DD-MM-YYYY', 
     minDate: new Date 
    }); 

Answer 13

$("#datePicker").datePicker({startDate: new Date() });。 這對我的作品

Answer 14

我用了min屬性：min="' + (new Date()).toISOString().substring(0,10) + '"

這裏是我的代碼和它的工作。

<input type="date" min="' + (new Date()).toISOString().substring(0,10) + '" id="' + invdateId + '" value="' + d.Invoice.Invoice_Date__c + '"/>