jQuery UI の Datepicker プラグインにおいて、カレンダーと、テキスト入力欄の日付のフォーマットを、ドロップダウンリストで選択した言語にローカライズする方法。
ローカライズ用の JavaScript ファイルは、i18n フォルダに入っている。ここで紹介している言語以外も、たくさん用意されている。
実装例（サンプル）
日付: （言語: ）
実装例（サンプル）の動作について
「日付:」の右側の、テキスト入力欄をクリックすると、今月の日本語のカレンダーが現れる。
カレンダーの日付をクリックすると、その日付を、テキスト入力欄に入力する。
をクリックすると、次月の日本語のカレンダーになる。
をクリックすると、前月の日本語のカレンダーになる。
「言語:」のドロップダウンリストから、言語を選択すると、カレンダーと、「日付:」の右側のテキスト入力欄の日付のフォーマットを、選択した言語用にローカライズする。
例えば、「English/UK」を選択すると、英語用にローカライズする。「German (Deutsch)」を選択すると、ドイツ語用にローカライズする。
実装例（サンプル）のソースコード
読み込み
パスは、それぞれ、アップロードした場所を指定する。
まとめて読み込む場合
<link rel="stylesheet" href="themes/base/jquery.ui.all.css" />
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="ui/jquery-ui-1.8.12.custom.min.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ja.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-en-GB.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-de.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-fr.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ko.js"></script>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="ui/jquery-ui-1.8.12.custom.min.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ja.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-en-GB.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-de.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-fr.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ko.js"></script>
個別に読み込む場合
<link rel="stylesheet" href="themes/base/jquery.ui.all.css" />
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ja.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-en-GB.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-de.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-fr.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ko.js"></script>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ja.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-en-GB.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-de.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-fr.js"></script>
<script type="text/javascript" src="ui/i18n/jquery.ui.datepicker-ko.js"></script>
JavaScript
<script>
<!--
jQuery( function() {
jQuery . datepicker . setDefaults( jQuery . datepicker . regional[ '' ] );
jQuery( '#jquery-ui-datepicker' ) . datepicker( jQuery . datepicker . regional[ 'ja' ] );
jQuery( '#jquery-ui-datepicker-locale' ) . change(function() {
jQuery( '#jquery-ui-datepicker' ) . datepicker( 'option',
jQuery . datepicker . regional[ jQuery( this ) . val() ] );
} );
} );
// -->
</script>
<!--
jQuery( function() {
jQuery . datepicker . setDefaults( jQuery . datepicker . regional[ '' ] );
jQuery( '#jquery-ui-datepicker' ) . datepicker( jQuery . datepicker . regional[ 'ja' ] );
jQuery( '#jquery-ui-datepicker-locale' ) . change(function() {
jQuery( '#jquery-ui-datepicker' ) . datepicker( 'option',
jQuery . datepicker . regional[ jQuery( this ) . val() ] );
} );
} );
// -->
</script>
HTML
<p>
日付: <input type="text" id="jquery-ui-datepicker" style="margin:0px;">
（言語:
<select id="jquery-ui-datepicker-locale">
<option value="ja" selected="selected">Japanese (日本語)</option>
<option value="en-GB">English/UK</option>
<option value="de">German (Deutsch)</option>
<option value="fr">French (Français)</option>
<option value="ko">Korean (한국어)</option>
</select>
）
</p>
日付: <input type="text" id="jquery-ui-datepicker" style="margin:0px;">
（言語:
<select id="jquery-ui-datepicker-locale">
<option value="ja" selected="selected">Japanese (日本語)</option>
<option value="en-GB">English/UK</option>
<option value="de">German (Deutsch)</option>
<option value="fr">French (Français)</option>
<option value="ko">Korean (한국어)</option>
</select>
）
</p>