在IE6下 彈出的div層無法遮蓋DropDownList/select控制項，如下方法可行：
<head runat="server"><br /> <title></title><br /> <mce:script type="text/javascript"><!--<br /> function divdis() {<br /> var divs = document.getElementById("divdis");<br /> var iffram = document.getElementById("frame1");<br /> if (divs.style.display == "none") {<br /> divs.style.display = "block";<br /> iffram.style.display = "block";<br /> }<br /> else {<br /> divs.style.display = "none";<br /> //iffram.style.display = "none";<br /> }<br /> }</p><p>// --></mce:script><br /></head><br /><body><br /> <form id="form1" runat="server"> <IFRAME id="frame1" width="300px" height="300px" style="position:absolute;z-index:1; background-color:Blue; display:none;" mce_style="position:absolute;z-index:1; background-color:Blue; display:none;" frameborder="0"></p><p> </IFRAME><br /> <div style=" width:300px; background-color:red; position:absolute; height:300px; display:none; z-index:100;" id="divdis"></p><p> aaaaa<br /> </div><br /> <div><br /> <asp:DropDownList ID="DropDownList1" runat="server"><br /> <asp:ListItem Text="aa" Value="0"></asp:ListItem><br /> <asp:ListItem Text="bb" Value="1"></asp:ListItem><br /> </asp:DropDownList><br /> <input id="Button2" type="button" value="button" onclick="divdis()" style=" text-align:right; width:300px;" /></p><p> </div><br /> </form>
原理：利用iframe來遮擋select，再用div來遮擋iframe，就這麼簡單。
1）首先，建一個div層和iframe層；
2）再設定它們的屬性，重要的樣式是用z-index來控制iframe和div的顯示順序，z-index的值越大，他會在表層顯示。
（注意：z-index只有在設定了position:absolute;後才會生效）
3）再用js來控制它們顯示和隱藏。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
