今週と今後の日付を無効にするJquery

Question

カレンダーを変更して週を選択し、効果的なテキストボックスに表示します。

私は現在の週だけでなく、将来の日付を無効にしようとしていますが、私はこれを試してみましたし、それが

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

私のフィドルが

$(function() { 
 
var startDate; 
 
var endDate; 
 

 
var selectCurrentWeek = function() { 
 
    window.setTimeout(function() { 
 
     $('.ui-datepicker-current-day a').addClass('ui-state-active') 
 
    }, 1); 
 
} 
 

 
$('.week-picker').datepicker({ 
 
    showOtherMonths: true, 
 
    selectOtherMonths: true, 
 
    changeMonth: true, 
 
    changeYear: true, 
 
    onSelect: function(dateText, inst) { 
 
     var date = $(this).datepicker('getDate'); 
 
     startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay()); 
 
     endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6); 
 
     var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat; 
 
     $("#txtWeekPicker").val($.datepicker.formatDate(dateFormat, startDate, inst.settings)+" - "+$.datepicker.formatDate(dateFormat, endDate, inst.settings)); 
 
     
 
     selectCurrentWeek(); 
 
    }, 
 
    beforeShowDay: function(date) { 
 
     var cssClass = ''; 
 
     if(date >= startDate && date <= endDate) 
 
      cssClass = 'ui-datepicker-current-day'; 
 
     
 
     selectCurrentWeek(); 
 
     return [true, cssClass]; 
 
    }, 
 
    onChangeMonthYear: function(year, month, inst) { 
 
     selectCurrentWeek(); 
 
    } 
 
}); 
 

 
$('.ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); }); 
 
$('.ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); }); 
 
});

<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script> 
 

 
<div class="week-picker"></div> 
 
<br /><br /> 
 
<input type="text" id="txtWeekPicker" class="week-picker" />

を下回っている仕事をdoesntのか分かりません

Answer 1

新しいHTML5週入力タイプを試してみることもできます。

<input type="week" max="week number"> 

しかし、スタイルを設定するのが難しく、現在の週を計算するにはJSを把握する必要があります。また、Firefoxのサポートもpre-IE 12もありません。