解决ie6的select问题很多天，什么时候能看见日出啊~~~~

xiaojing_tkgame 2011-09-01 09:56:05

一个星期了，有名的ie6的 select下拉框的bug，命苦~~~疯掉之后的之后了~~找不到一个好办法呢？

...全文

270 12 打赏收藏转发到动态举报

写回复

用AI写文章

12 条回复

切换为时间正序

请发表友善的回复…

发表回复

游一游走一走 2011-09-01

打赏
举报

我常用的解决法子
//设置select的可见状态
function setSelectState1(state)
{
var objl=document.getElementsByTagName('select');
for(var i=0;i<objl.length;i++)
{
objl[i].style.visibility=state;
}
}
//隐藏调用setSelectState1('hidden');
//显示调用setSelectState1('');
做弹出框时先调用隐藏方法，关闭时调用显示方法

EverWHL 2011-09-01

打赏
举报

什么bug?代码贴出来看看啊

codeallen 2011-09-01

打赏
举报

用jQuery的dialog就可以盖住。

我们之前的做法是用panel和DIV结合，用一个大的panel盖住整个页面，设置透明的属性，然后再panel上面付出一个DIV就可以盖住select标签

注：这样的缺点是DIV弹出后，用户将不能操作DIV下面的主页面。

NewMoons 2011-09-01

打赏
举报

用框架解决,推荐jquery和Prototype

xiaojing_tkgame 2011-09-01

打赏
举报

[Quote=引用 11 楼 everwhl 的回复:]
abcc项目实现这样一个功能：点击“上载查询”，弹出一个绝对定位的div（类似qq文件中转站的“上传文件”按钮），里面有上传按钮等，点击后div在最上层。即z-index为最大。在firefox下表现良好，在IE6下无论如何也盖不住select。这是IE下一个著名的bug，解决方法用一个iframe包住select。

以下是一个测试的静态html，为bug重现及及解决方法。

……
[/Quote]你这个只是针对这一个地方，因为我要改的地方很多，所以这样比较麻烦，想找个插件什么的

EverWHL 2011-09-01

打赏
举报

abcc项目实现这样一个功能：点击“上载查询”，弹出一个绝对定位的div（类似qq文件中转站的“上传文件”按钮），里面有上传按钮等，点击后div在最上层。即z-index为最大。在firefox下表现良好，在IE6下无论如何也盖不住select。这是IE下一个著名的bug，解决方法用一个iframe包住select。

以下是一个测试的静态html，为bug重现及及解决方法。



  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  

<html>  

<head>  

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  

<title>Insert title here</title>  

  

    <style type="text/css">      

       

        #d1,#d2 {   

            width:  400px;   

            height : 400px;   

        }   

        #d1 {          

            position : absolute;   

            top : 100px;   

            background : red;   

            z-index : 1;   

        }   

        #d2 {   

            position : absolute;   

            top : 150px;   

            background : blue;   

            z-index : 2;   

        }   

  

    </style>  

</head>  

<body>       

       

    <div id="d1">    

        <form>               

            <input type="text" name="username"/>  

        </form>  

        <p>中國</p>  

        <form>  

            <iframe style="z-index:1"><!-- 用iframe 解决此bug -->      

            <select name="country">                  

                <option value="1">china</option>  

                <option value="2">japanese</option>  

                <option value="1">U.S.A</option>  

            </select>  

            </iframe>  

        </form>  

    </div>  

       

    <div id="d2">ddd</div>  

  

</body>  

</html>