Question

所以我使用的是jQueryUI的对话框。但正如我所读到的，IE6中有一个常见的错误（不幸的是，我必须确保这适用于），下拉列表不关注z索引队列。我还读到有一个叫做bgiframe的方便插件可以解决我的覆盖问题。我发现了人们说的两种不同的使用方式，但都不起作用。我可能只是在做一些非常愚蠢的事情，但我需要让它发挥作用。

including jQuery.bgiframe.js Version 2.1.1 Here are the 2 ways I have attempted to use it without working: (I have included all jQuery-UI, jQuery, and bgiframe in the page that I am working on)

实际插件的文档中说：
```
$("#selectDropdownThatNeedsFixing").bgiframe();
```
这会导致一个jQuery异常，说需要Object。
我从以下页面看到的第二种方式：http://docs.jquery.com/UI/Dialog/dialog基本上，您只需在初始化对话框时设置bgiframe:true：
```
$( ".selector" ).dialog({ bgiframe: true });
```

这并没有出错，但当我测试它时，问题仍然存在于IE6中。

我是不是错过了什么？我应该用哪种方式使用bgiframe？任何指示都将不胜感激。谢谢你的帮助！

Answer 1

你不需要为此使用插件。IE6和z索引的问题是，IE6中定位的元素生成了一个新的堆叠上下文，该上下文从z索引值0开始。因此，z索引在IE6中不能正常工作。解决此问题的方法是在父选择器中指定一个z索引值，该值等于在子选择器中指定的z索引。

Check working example at http://jsfiddle.net/ebgnu/2/

下面是我在jsfiddle中做的例子。

.parent{
    position: relative;
    color:white;
}
.parent#a {
    height: 2em;
    z-index: 1;
}
.parent#a .child{
    position: absolute;
    height: 6em;
    width: 2em;
    z-index: 1;
    background:blue;
}
.parent#b {
    height: 2em;
    background:red;
}

<div class="parent" id="a">
    <div class="child">a</div>
</div>
<div class="parent" id="b">
    <div class="child">b</div>
</div>

看看.parent#a这是z索引为1的子选择器aa的子项和z索引的父项的值：0。这会把它送到后面。

Answer 2

I believe that you re supposed to call the bgiframe plugin on the dialog, not the < select >. The current jQuery UI version doesn t seem to list the bgiframe option for the dialog widget anymore.

您得到的jQuery Exception似乎表明，您所针对的元素对于指定的选择器不存在（＜code＞#selectDropdownThatNeedsFixing＜/code＞）。

如果问题仍然存在，请尝试使用IE开发人员工具栏来确定iframe是否确实已创建。

Check working example at http://jsfiddle.net/ebgnu/2/

友情链接