【jQueryUI】DatePickerを実装する。

めも。

まずは下記の通り必要なファイルをヘッド内で読み込む。

<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3.custom.min.css" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

次に任意のインプット要素を配置。

<input type="text" class="datetime" name="date">

そしたら最後にスクリプトを実行。

$(function() {
	$('.datetime').datepicker();
});

datepicker()に様々なパラメーターを渡せるため容易にカスタマイズも可能。プロパティの詳細は下記公式リファレンスを参照されたし。

http://jqueryui.com/datepicker/

 

One Comment

  1. […] 以前の記事←に加えて、下記のスクリプトを読み込むことで日本語化が可能。 […]

Comments are closed.