Question

我希望monthpicker在页面加载时始终打开。并且更改月份或年份它将自动更新为标签。我可以处理事件以进行标签更新等。

但我希望它在页面上打开已加载。我正在按照这个答案： - https://stackoverflow.com/a/6013093/4952944

我尝试过： - http://jqueryui.com/datepicker/#inline但它适用于日期我想让它适用于月份和年份选择器。

我尝试了一个演示，如果我使用jquery UI进行分区。

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

我像这样使用Jquery： -

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

它正常工作，datepicker打开内联并持续打开。但我想让它适用于上面的SO代码。当页面加载时，我尝试了所有内容。我不确定但可能是由于某些更改事件，它没有加载到页面加载。

Answer 1

我得到了我的解决方案。在页面加载隐藏日历视图。

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

我已根据我的要求更改了脚本。但是在页面加载时需要注意两件事隐藏日历视图。在onChangeMonthYear事件被触发时使用以下脚本

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

脚本： -

<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： -

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

使用Jquery UI保持MonthPicker打开

1 个答案: