jQuery-UI æ—¥ä»˜é¸æŠžãƒœãƒƒã‚¯ã‚¹(DatePicker)
※画åƒ
(1)国際化対応ã®ãƒ©ã‚¤ãƒ–ラリをインãƒãƒ¼ãƒˆ
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/i18n/jquery-ui-i18n.min.js”></script>
 â†ã‚¯ãƒªãƒƒã‚¯ã™ã‚‹ã¨æ—¥ä»˜é¸æŠžç”»é¢ãŒè¡¨ç¤ºã•れる
<input type=”text” id=”date1″ size=”10″ />
<script type=”text/javascript”>
  $(function() {
    // (2)日本語を有効化
    $.datepicker.setDefaults($.datepicker.regional[‘ja’]);
    // (3)æ—¥ä»˜é¸æŠžãƒœãƒƒã‚¯ã‚¹ã‚’ç”Ÿæˆ
    $(‘#date1’).datepicker({ dateFormat: ‘yy/mm/dd’ });
  });
</script>
<input type=”text” id=”date2″ size=”10″ />
<script type=”text/javascript”>
  $(‘#date2’).datepicker({
    dateFormat: ‘yy/mm/dd’,
    showOn: ‘button’,  //both, focus, button
    buttonImage: ‘https://office-yone.com/wp-content/uploads/2014/06/calender.gif’,
    minDate: 0,
    maxDate: +40,
    changeYear: true,  //表示年を変更ã™ã‚‹ãŸã‚ã®é¸æŠžãƒœãƒƒã‚¯ã‚¹ã‚’表示ã™ã‚‹ã‹
    changeMonth: true,  //表示月を変更ã™ã‚‹ãŸã‚ã®é¸æŠžãƒœãƒƒã‚¯ã‚¹ã‚’表示ã™ã‚‹ã‹
    showOtherMonths: true,  //å‰å¾Œã®æœˆã«å±žã™ã‚‹æ—¥ã‚‚表示ã™ã‚‹ã‹
    showButtonPanel: true,  //[今日][閉ã˜ã‚‹ï¼½ãƒœã‚¿ãƒ³ã‚’表示ã™ã‚‹ã‹
    showAnim: ‘show’,  //カレンダー表示時ã«ä½¿ç”¨ã™ã‚‹ã‚¨ãƒ•ェクト
    numberOfMonths: 2,  //一度ã«è¡¨ç¤ºã™ã‚‹æœˆã®æ•°
  });
</script>