jQueryUIのDatepickerでカレンダーを表示してみる。

日付を選択するようなサービスだと使ってるとこ多い気がする。
(って事ですごい今更な感じもする)

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/smoothness/jquery-ui.css" />

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>

<form>
 <input type="text" id="datepicker">
</form>

jQueryと、jQueryUIのCSS+JSを読み込んで、日付が入るinputを用意。

$(function(){
     $('#datepicker').datepicker({
        dateFormat: 'yy-mm-dd',
        showMonthAfterYear: true,
        monthNames: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
    });
});

dateFormatは、適当に・・。
showMonthAfterYearは、年 月で表示(defaultは、月 年)
monthNamesは、月の表示名。

で、スマホで見ると微妙に選択しずらいかも・・。
ある程度のウインドウサイズが無いと厳しいかもしれませんね。