jQueryで年月カレンダーを一瞬でプルダウン化!「Facebook Like Datetime Picker」

twitterにつぶやく このエントリーを含むはてなブックマーク はてなブックマークを見るこの記事をクリップ!Yahoo!ブックマークに登録このエントリーをdel.icio.usに追加する

フォームで例えば誕生日を入力させたい時、1つ1つ年をoptionに入れるのは億劫ですし、年が変わった時に変更が面倒です。
それでJavaScriptライブラリ「jQuery」のプラグインJquery Facebook Like Date Time Pickerを利用します。
jQueryで年月カレンダーを一瞬でプルダウン化!「Facebook Like Datetime Picker」サンプル

使用方法
Jquery Facebook Like Date Time PickerからfbDateTimeをダウンロードします。
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="fbDateTime-0.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$().fbDateTime({
yearStart:1990 //開始年
});
});
</script>

最後に以下のように記述すれば完成です。
日:<select id="date"></select>
月:<select id="month"></select>
年:<select id="year"></select>
時:<select id="hour"></select>
分:<select id="minute"></select>
秒<select id="second"></select>


jQueryで年月カレンダーを一瞬でプルダウン化!「Facebook Like Datetime Picker」サンプル

記事作成:2010年02月17日

JavaScriptライブラリ
JavaScriptライブラリまとめ
JavaScriptライブラリのメインストリーム「jQuery」プラグインまとめ
jQueryプラグインまとめ
通が好むJavaScriptライブラリ「mootools」プラグインまとめ
mootoolsプラグインまとめ