2

我讨厌默认选择控件，那是因为它不能在 IE 中使用 CSS 设置样式。这就是为什么我从头开始开发一个新的选择控件，使用 HTML + CSS + JavaScript。在过去的两天里，我将 CSS 和 HTML 匹配在一起做得很好，但今天我发现了一个看起来很难修复的错误。

在 IE 7 中，当我在同一页面上有两个控件时，顶部的控件不会覆盖底部的控件。

查看图片：coolrgb dot com/files/select-help.jpg

下载演示页面（HTML + CSS + Javascript）：coolrgb dot com/files/select-help.zip

请帮助我，这个控件对我来说看起来很不错，我想从现在开始在我的所有项目中使用它。这个错误扼杀了我的希望和大量时间。

谢谢你。

4

2 回答 2

3

编辑：重读问题后，这个答案现在似乎完全不相关，但我还是把它留在这里。

不是真正的答案，而是试图解释：

在 Internet Explorer 中，<select>标签被实现为简单的窗口控件，而所有其他元素都是无窗口控件（这允许它们被设置样式）。这就是为什么这些标签总是在顶部并且不遵循 z 顺序规则。（下拉菜单部分必须是可设置样式的，因此它是一个无窗口控件，因此它显示在主要部分下方。）

在 Firefox 中，所有元素都是无窗口的，在 IE8 中也应该如此。

于 2009-05-31T19:24:21.127 回答
3

如果您给每个控件相同的 z-index，那么您将无法控制堆叠顺序。

我建议修改您的控件，使其表现得更像一个真正的 SELECT 元素：一次只能打开一个，否则失去焦点会导致它关闭。或者，您可以在控件具有焦点时设置较高的 z-index，而在没有焦点时设置较低的 z-index。

另一件需要注意的事情：尝试将其他一些控件（如单选、复选框和选择）置于您的控制之下。您可能会发现，即使您给它们一个不同的 z-index，IE 也不会悬停在它们上面（正如@grawity 在他的回答中解释的那样）。这就是为什么您通常会看到小部件演示显示在这些元素之上，如下所示：http: //jqueryui.com/demos/dialog/

解决此问题的典型方法是使用 iframe，但这可能值得提出一个完全不同的问题。

于 2009-05-31T19:29:49.977 回答