在jquery datepicker上的afterShow事件

我正在使用jquery ui 1.12.0。 我想在有人点击文本框并且日期选择器显示后更改z-index。

jsFiddle的例子

我尝试添加以下内容，但实际上不明白_updateDatepicker_original和_updateDatepicker是什么：

$.datepicker._updateDatepicker_original = $.datepicker._updateDatepicker; $.datepicker._updateDatepicker = function(inst) { $.datepicker._updateDatepicker_original(inst); var afterShow = this._get(inst, 'afterShow'); if (afterShow) afterShow.apply((inst.input ? inst.input[0] : null)); } 

然后称之为：

 $('.AddDatePicker').datepicker({ afterShow: function () { $('.ui-datepicker').css('z-index', '1000001'); } }); 

但是，在我更改月份之前，z-index不会改变。

在jQuery UI datepicker上有’afterShow’吗？ 没有答案……

任何指针，提示，提示将不胜感激。 谢谢 ：）

Answer 1

您可以使用css，而无需使用javascript

 .ui-datepicker.ui-widget { z-index: 3 !important; } 

另一个选择是使用beforeShow回调，以便将特定的类添加到datepicker：

 $(function() { $('.AddDatePicker').datepicker({ beforeShow: function(el, inst) { inst.dpDiv.addClass('zin') } }); }); 

 .itw { z-index: 2; display: block; background-color: black; position: absolute; } .zin { z-index: 3 !important; } 

Answer 2

将设置时间添加到空白允许在_updateDatepicker事件的第一次触发时更改css。 经过更多研究后，我发现_updateDatepicker是一个带有jquery ui源代码的事件：

 /* Generate the date picker content. */ _updateDatepicker: function( inst ) {... 

我的解决方案

  $('.AddDatePicker').datepicker({ beforeShow: function () { setTimeout(function () { $('#ui-datepicker-div').css('z-index', '1000001'); }, 0); } });