ModalPopupExtender 背后的 JQuery Timepicker答案

【问题标题】：JQuery Timepicker behind ModalPopupExtenderModalPopupExtender 背后的 JQuery Timepicker
【发布时间】：2013-07-06 19:56:18
【问题描述】：

我想修复modalPopupExtender的2层后面的JQuery Timepicker的z-index。到目前为止，我尝试通过将 .ui-timepicker-div 的 z-index 更改为 100002 来修复它，如下所示：

.ui-timepicker-div
{
    z-index:100002;
}

但仍然没有运气。有关解决此问题的可能方法的任何建议？可以是 jQuery 本地化，也可以是纯 css 编码。

谢谢。

【问题讨论】：

标签： jquery asp.net css modalpopupextender

【解决方案1】：

试试这个

.ui-timepicker  //on .ui-datepicker because it gives z-index to this div at runtime and add position:absolute;
{
    z-index:100002 !important;
    position:absolute;
}

【讨论】：

【解决方案2】：

尤里卡！我终于设法通过以下场景的组合调整来解决这个问题：

2-Layer modalPopupExtender 正在回发。这意味着之前的 jQuery localize 已经不复存在了。要解决此问题，而不是 $(document).ready(function() {});，你必须像这样使用function pageLoad(){}：
```
function pageLoad()
{
   $('#ctl00_ContentPlaceHolder1_txtTimeSlotFrom').timepicker({
        hourGrid: 4,
        minuteGrid: 10
   });
}
```

现在，为了修复 z-index，我在本地化中包含 beforeShow 配置，如下所示：

        $('#ctl00_ContentPlaceHolder1_txtTimeSlotFrom').timepicker({
            hourGrid: 4,
            minuteGrid: 10,
            beforeShow: function() {
                setTimeout(function(){
                    $('.ui-timepicker').css('z-index', 16777271);
                }, 0);
            }
        });

【讨论】：