如何防止下拉列表在DropDownList中打开？

Question

我有一个自定义表,我想用它作为DropDown部分DropDownList.

理想情况下,当用户点击a时DropDownList,它应该显示自定义表而不是通常的下拉列表.我认为在不禁用DropDownList控件的情况下防止打开下拉是很容易的,但是看起来并非如此.

是否有一种简单的方法可以防止DropDownList打开而不禁用它？

编辑:这必须适用于嵌入式IE 7 Web浏览器,并且e.preventDefault()不适用于该浏览器版本

Answer 1

你可以这样做:

基本上,我已经在下拉列表上放置了一个不可见的div来阻止它,你可以通过屏蔽div的onclick处理点击.

编辑:我已经更新了这个http://jsfiddle.net/EdM7B/1/

<div id='mask' onclick='alert("clicked");' style='width:200px; height:20px; position:absolute; background:white;filter:alpha(opacity=0);'></div>
<select id='selectList' show=1 style='width:200px; height:20px;'>
    <option>Test</option>
</select>

我不得不使用一种黑客攻击,因为IE似乎没有正确渲染没有背景颜色的div,所以它无法正常工作.这适用于我的IE7.

如果你想让它在所有浏览器中工作,你需要添加chrome/firefox opacity CSS或者只有一些IE才能应用背景颜色.

我认为由于它位于上面的方式,不透明度实际上不能正常工作,因为元素绝对定位,无论它看起来如何工作.我最初把它作为不透明度1,但这对我来说听起来不对,因为我们希望它不可见,所以我把它改为0.