2015-09-14  2016-10-22

jQuery UI datepicker 用の祝祭日ツールチップ表示

日付選択ダイアログ datepicker に日本の祝祭日のツールチップを表示させる jquery プラグインです。

jquery.holiday.js 2016-10-22 α版

Download

祝祭日のデフォルト表示

サンプル

ソース

 

※おなじみの datepicker に .holiday() を加えるだけ。

祝祭日のオプション指定

サンプル


↑クリックで datepicker 表示。

ソース

 

祝祭日のカスタマイズ

祝祭日の日付を通年の月日や第n月曜日で指定したり、個別の西暦年月日で指定したり、祝祭日の名称を指定することができます。

ソース

 

日本の祝祭日の英語版カスタマイズ例

(jquery.holiday_en-JP.js)

サンプル

ソース

日付入力欄の動的な追加に対応

サンプル

↑クリックで datepicker 表示。
日付入力で行追加。

ソース

 

 

※動的に生成されたinput要素に対してもdatepicker()とholiday()を設定。
 このとき同じinput要素に対して重複してholiday()が実行される問題を回避。

備考

プログラムについて

  • 2007年以降から2015年現在で予測できる祝祭日に対応しています。
    「山の日(2016年以降の8月11日)」にも対応しました。
  • 確認ブラウザ Chrome 45.0.2454 FireFox 39.0.3 IE8互換 IE9互換 IE10 (Windows 7)
  • 改造、再配布、商用利用など自由に使っていただけます。
  • お気づきの点その他ありましたらお知らせください。

更新履歴

2015-12-22
祝祭日カスタマイズ例(日本語版)の追加
2016-10-22
動的なinput要素の追加に対応