jQuery UI Datepicker Widget
jQuery UI の
Datepicker Widget のカレンダー入力が簡単で便利だった。
<link rel="stylesheet" href="./js/jquery-ui/jquery-ui.css" />
<link rel="stylesheet" href="./js/jquery-ui/jquery-ui.structure.css" />
<link rel="stylesheet" href="./js/jquery-ui/jquery-ui.theme.css" />
<script src="./js/jquery-ui/jquery-ui.js"></script>
<script>
$(function() {
$('#datepicker').datepicker({
closeText: '閉じる',
prevText: '前の月へ',
nextText: '次の月へ',
currentText: '今日',
monthNames: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
monthNamesShort: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
dayNames: ['日曜日', '月曜日', '火曜日', '水曜日', '木曜日', '金曜日', '土曜日'],
dayNamesShort: ['日', '月', '火', '水', '木', '金', '土'],
dayNamesMin: ['日', '月', '火', '水', '木', '金', '土'],
weekHeader: '週',
dateFormat: 'yy/mm/dd',
showMonthAfterYear: true,
yearSuffix: '年',
minDate: '+1d',
showButtonPanel: true,
beforeShowDay: function(date) {
//日曜日
if (date.getDay() == 0) {
return [false, ''];
}
//土曜日
if (date.getDay() == 6) {
return [false, ''];
}
//平日
return [true, ''];
}
});
});
</script>
<input id="datepicker" type="text" />
[2015/03/31]