5

我正在尝试在弹出窗口中显示日期选择器（使用引导程序和引导程序日期选择器扩展）并遇到一些问题，首先我在显示日期选择器时遇到问题并找到了这个主题：弹出窗口中的日期选择器不会显示 ，但现在是显示在我的弹出框后面，因此它不完全可见

这是 HTML 代码：

<button type="submit" class="btn btn-primary pop_doleance" rel="popover" data-original-title="Ajouter doléance">Ajouter doléance</button>

<div style="display: none" class="pop_doleance_content">
<form class="well form-inline form_doleance">
    <label for="date">Date : </label>
    <input id="date" type="text" class="input-medium">
</form>

和 Javascript 代码：

var tmp = $.fn.popover.Constructor.prototype.show;
$.fn.popover.Constructor.prototype.show = function (){
    tmp.call(this);
    if (this.options.callback) {
    this.options.callback();
    }
}

$(function (){
    $(".pop_doleance").popover({
        placement:'bottom', 
        html : true, 
        content: function(){return $('.pop_doleance_content').html();},
        callback: function(){$('#date').datepicker();}
    });  
});

有任何想法吗 ？

4

2 回答 2

8

将弹出窗口的 z-index 设置为较低的值。

.popup { z-index : 900; }

并将 datepicker 的容器 z-index 设置为更高的值，例如 jquery ui datepicker set

.ui-datepicker-div { z-index: 999; }
于 2013-06-03T13:18:25.880 回答
5

在我添加的CSS中：

.datepicker { 
    z-index: 999 !important;
}

注意“！重要”。没有这个就行不通。

于 2018-07-15T01:51:46.427 回答