div遮蓋select的解決方案(簡單)

IE6以及一下版本下，選擇框Select會覆蓋Div中的內容
一般情況下，可以將顯示的內容放到Iframe中，然後再顯示架構內的內容。由於Iframe的可以顯示在Select上層，就可以解決這個問題。不過這樣做在實現上比較麻煩。

有個解決的部分就是在Div內容中加入不顯示的Iframe架構即可，不用修改其他內容。加了句這個：

<iframe style="position:absolute; z-index:-1;width:100px;" frameborder="0" src="about:blank"></iframe>

 

 

在IE裡，層DIV被下拉框SELECT遮蓋，這是IE的bug之一，原因在於select的優先順序別比div高。因此無論如何用css屬性z-index設定都沒用。

所以，解決的辦法有兩種

在顯示div的時候隱藏所有select
讓div裡的內容比select的優先順序還要高
第一種方法顯然比較麻煩，特別是當select比較多且位置不固定的時候，很容易將不該隱藏的也隱藏了。

第二鐘辦法更好一些。常用的優先順序比select高的HTML控制項有object和iframe，我選用了iframe比較好。

原理就是在div種加入一個iframe，然後把需要顯示的內容write到iframe的body中。

參考代碼如下：

var oIframe = document.createElement("<iframe name=/"oIframeFilter/" frameborder=/"0/"></iframe>")
if (oDivFilter.children.length != 0) oDivFilter.removeChild(oDivFilter.children(0));
oDivFilter.appendChild(oIframe);
window.frames[oIframe.name].document.write("<link rel=/"stylesheet/" href=/"/style/css.css/" type=/"text/css/">");
sBody = "<table><tr><td>哈哈哈哈</td></tr></table>";
window.frames[oIframe.name].document.write(sBody);

此外，還需要注意iframe的屬性allowTransparency就不能再用了，因為透明就讓iframe更高的優先順序失效了

本文來自CSDN部落格，轉載請標明出處：http://blog.csdn.net/URL/archive/2005/04/27/365525.aspx