jquery DatePicker完成按鈕

Question

有沒有辦法處理在jQuery UI DatePicker中按下「完成」按鈕的事件？

我有一個日期選擇器，只允許爲年份和月份之間選擇here

的問題是，使用OnClose事件阻止我清場（如果我點擊的日期選擇這樣會彈出然後如果我關閉當前選定的月份和年份將被放入該字段中）。

我不想在datepicker之外使用額外的「清除」按鈕，所以我儘管可以使用完成按鈕。

Answer 1

爲 「完成」 按鈕調用_hideDatepicker功能，你可以重寫它：

jQuery.datepicker._hideDatepicker = function() { 
    alert('hello'); 
}; 

Answer 2

可能：

$('#myInput') 
    .datepicker({ 
     // datepicker options 
    }) 
    .datepicker('widget') 
    .find('.ui-datepicker-close') 
    .on('click', function() { 
     // done button's handler here 
    }); 

Answer 3

這裏是完美的解決方案：

$(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

禮貌：THIS和THAT SO答案合併，使這個解決方案。

Answer 4

我在一個論壇上找到解決方案（不記得在哪裏 - 抱歉）。我知道這是一段時間，但爲了將來的搜索:)

注：需要在插件中完成更改。您只需搜索「onClose：」即可找到它。

onClose: function (dateText, inst) { 
    function isDonePressed() { 
     return ($('#ui-datepicker-div').html().indexOf('ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all ui-state-hover') > -1); 
    } 
    if (isDonePressed()){ 
     alert('done pressed'); 
    } 
} 

Answer 5

$('#start_date_download').datepicker({ 
    dateFormat:"yy-mm-dd", 
    "autoclose": true, 
    showButtonPanel: true, 
    closeText: 'Clear' 
}).focus(function() { 
    var thisCalendar = $(this); 
    $('.ui-datepicker-close').click(function() { 
     $.datepicker._clearDate($('#start_date_download')); 
    }); 
});