Jquery UIを使用してMonthPickerを開いたままにする

Question

ページが読み込まれている間は常に月ピッカーを開くようにします。月または年を変更すると、自動的にlableに更新されます。ラベルの更新などのイベントを処理することができます。

しかし、私はそれを開くにはページが開きます。 私はこの答え、次のよ： - ：http://jqueryui.com/datepicker/#inlineしかし、それは、私はそれが月と年ピッカーのために働くようにしたい日付のために働く - https://stackoverflow.com/a/6013093/4952944

を私が試してみました。

jqueryのUIを使用して私が私たちにデモを試しました。

Date: <div id="datepicker"></div> 

そして、私はこのようにjqueryのを使用します - それは、日付ピッカーが継続的にインラインでオープンを開き、作品

$(function() { 
     $("#datepicker").datepicker(); 
}); 

。 しかし私はそれを上のSOのコードのために働かせたい。私はページが読み込まれるときにそれを置くようなものすべてを試しました。 私は確信していませんが、ページロードでロードされていない変更イベントが原因である可能性があります。

Answer 1

私の解決策が見つかりました。 [読み込み]ページでカレンダービューを非表示にします。

$('.ui-datepicker-calendar').css('display','none'); 

私は自分の要件に従ってスクリプトを変更しました。 ここでは、ページの読み込み時に注意すべき点は、カレンダー表示を非表示にすることです。

<script type="text/javascript"> 
    $(function() { 
     $(".monthPicker").datepicker({ 
      dateFormat: 'MM yy', 
      changeMonth: true, 
      changeYear: true, 
      showButtonPanel: true, 
      beforeShow: true, 
      onChangeMonthYear: function(dateText, inst) { 
       setTimeout(function() { 
        $('.ui-datepicker-calendar').hide(); 
       }); 
       var month = $(".ui-datepicker-month :selected").val(); 
       var year = $(".ui-datepicker-year :selected").val(); 
       alert(month); 
       alert(year); 
      } 
     }); 
     $(".monthPicker").focus(function() { 
      $(".ui-datepicker-calendar").hide(); 
      $("#ui-datepicker-div").position({ 
       my: "center top", 
       at: "center bottom", 
       of: $(this) 
      }); 
     }); 
    }); 
</script> 

HTML： - - ：onChangeMonthYearイベントが発生したときと

setTimeout(function() { 
        $('.ui-datepicker-calendar').hide(); 
}); 

スクリプト、スクリプトの下に使用

<div class="monthPicker" id="month"></div>