jQueryベースのカレンダー作成javascript「jCalendar」

フォームなどでは日付を指定させることが多く、利便性が求められます。
jCalendarはjQueryベースでカレンダーを作成するjavascriptで、利用者のユーザビリティーを向上させることができます。

使用方法

jCalendarからjcalendar.js、jcalendar.cssをjQueryからjquery.jsをダウンロードします。

<script src="http://yourdomain/jquery.js" type="text/javascript"></script>

<script src="http://yourdomain/jcalendar.js" type="text/javascript"></script>

<link rel="stylesheet" href="http://yourdomain/jcalendar.css" type="text/css">

<script type="text/javascript">

$(document).ready(function() {

  $('#id名').jcalendar();

});

</script>

上記の様にjavascriptを記述します。
さらにHTMLでは、上で指定した#id内に日、月、年をselectで指定し、<div class="jcalendar-selects"></div>で囲みます。
長くなるため割愛しますので、ソースを参考にしてください。

サンプル

カレンダー

Javascriptサンプルページ一覧

skuare.net