IE中Option的disabled无效 Select只读模式

给IE下的option项添加disabled的禁用功能

window.onload = function() {
    if (document.getElementsByTagName){
        var s = document.getElementsByTagName("select");
        if (s.length > 0){
            window.select_current = new Array();
            for (var i=0, select; select = s[i]; i++){
                select.onfocus = function(){
                    window.select_current[this.id] = this.selectedIndex;
                }
                select.onchange = function(){
                    restore(this);
                }
                emulate(select);
            }
        }
    }
}

function restore(e){
    if (e.options[e.selectedIndex].disabled){
        e.selectedIndex = window.select_current[e.id];
    }
}

function emulate(e){
    for (var i=0, option; option = e.options[i]; i++){
        if (option.disabled){
            option.style.color = "graytext";
        }else{
            option.style.color = "menutext";
        }
    }
} 

select只读模式
1.disabled：方便，但在表单提交时无法获得值

<select name="" disabled="disabled">
<option>哎，禁用了啊。</option>
<option>没用的选项。</option>
</select>

2.给出默认值，改变选项时自动变回默认选项

<select name="select" onchange="selectedIndex=0">
<option>abc</option>
<option>def</option>
</select>

3.使用optgroup元素

<select>
<option selected>下面两项只能看看啊</option>
<optgroup label="看看一">
</optgroup>
<optgroup label="看看二，哈哈">
</optgroup>
</select>

参考内容：
1.http://www.cainiao8.com/web/js_blueidea/32_readonly_select.html
2.http://blog.csdn.net/fableking/archive/2008/01/31/2075881.aspx

评论

1 楼 gladto 2010-10-16  

optgroup第一次见
好东西~