3

我正在使用 jQuery UI 日期选择器，..

Datepicker 工作正常，但是当我们在日历之外单击或单击Escape按钮时它会关闭。但我希望我的日期选择器仅在我们单击完成按钮时关闭。

$(".date-picker").datepicker({
    dateFormat: 'mm-yy',
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,

    onclose: function(dateText, inst) {
        var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
        var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
        $(this).val($.datepicker.formatDate('yy-mm', new Date(year, month, 1)));
    }
});

我怎样才能做到这一点？

4

2 回答 2

4

此解决方案也已发布在jquery DatePicker Done button中，并且效果很好： 

$(function() {
    $('.monthYearPicker').datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'MM yy'
    }).focus(function() {
        var thisCalendar = $(this);
        $('.ui-datepicker-calendar').detach();
        $('.ui-datepicker-close').click(function() {
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            thisCalendar.datepicker('setDate', new Date(year, month, 1));
        });
    });
});

CSS： 

.ui-datepicker-calendar {
    display: none;
}

和HTML： 

<label for="myDate">Date :</label>
<input name="myDate" class="monthYearPicker">

看看它在这个jsfiddle中是如何工作的。

来源：http: //develop-for-fun.blogspot.com/2013/08/jquery-ui-datepicker-month-and-year.html

于 2013-08-16T07:06:55.407 回答
1

无法控制关闭日期选择器的触发器。您可以获得的最接近的可能是创建一个内联日期选择器并随意显示/隐藏。但是，“完成”按钮不会出现在内联日期选择器中，因为内联日期选择器通常不需要隐藏。这是我得到的最接近的，没有得到hacky：

http://jsfiddle.net/william/c8Kcs/1/

HTML：

<input id="date" /> <button id="done">Done</button>
<div class="date-picker"></div>

JavaScript：

$(".date-picker").hide().datepicker({
    dateFormat: 'mm-yy',
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    altField: '#date'
});

$('#date').click(function() {
    $(".date-picker").show();
    $('#done').show();
});

$('#done').hide().click(function() {
    $(".date-picker").hide();
    $(this).hide();
});
​
于 2012-09-24T14:40:51.067 回答