jQueryUIのDatepickerでカレンダーを表示してみる。
2014年10月25日
日付を選択するようなサービスだと使ってるとこ多い気がする。
(って事ですごい今更な感じもする)
<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は、月の表示名。
で、スマホで見ると微妙に選択しずらいかも・・。
ある程度のウインドウサイズが無いと厳しいかもしれませんね。