解決Dropdownlist物件出現在DIV之上

最近因為在寫PHP網頁, 再次遇到這樣的現象, 以前遇到的時候並沒有特別找方法去解決, 以為這是正常現象, 無可避免, 但是現在這個問題會造成操作上的不正常, 一定得解決, 於是就在姑狗上找到了解答。

原來dropdownlist並不是form原生的物件, 所以會在div蓋上後還是看得到,而解決方法就是透過可以蓋住dropdownlist的iframe來解決。

1.先在新的DIV裡面放置一個iframe並設定與期望的div大小相同, 當作DIV的最底層
2.在iframe後再設定一個DIV,裡面即放本來要放的HTML

範例:

//新的DIV
<div style="top: 50px; position: absolute; width: 400px; height: 200px;">
//用來當底層蓋住dropdownlist的iframe
<iframe style="left: 0pt; top: 0pt; position: absolute; z-index: 9;" frameborder="0″> </iframe>
//真正呈現內容的DIV
<div style="border-style: ridge; left: 0pt; top: 0pt; width: 400px; height: 200px; position: absolute; z-index: 10; background-color: rgb(204, 204, 255);">
</div>
</div>

參考連結