js Select下拉框的只读属性设置

因为Select下拉框只支持disabled属性，不支持readOnly属性，

但是用disabled就无法将下拉框中的数据读出来，所以要想办法将select下拉框设置成只读的。

将select下拉框设置成readonly 的两种办法。

第一种：

<script>var f=s.selectedIndex</script>
<select name=s onchange="selectedIndex=f"> 
<option>1 </option> 
<option selected>2 </option>  
</select>  

 第二种：

 

    <span onmousemove="this.setCapture();" onmouseout="this.releaseCapture();" onfocus="this.blur();">  
    <select >   
    <option>1 </option>   
    <option selected>2 </option>   
    </select>  
    </span>  

 

 

    其中onmousemove="this.setCapture();" onmouseout="this.releaseCapture();" 屏蔽了鼠标事件，

 onfocus="this.blur();"屏蔽了键盘事件，onfocus="this.blur();"表示该对象将获得焦点时就让它失去焦点，按   键盘的TAB键时跳过它，使下一个控件获得焦点。

 

在网上搜索了一下，发现有个一下类似的方法：

①

    <select name="select123" onbeforeactivate="return false;" onfocus="this.blur();" onmouseover="this.setCapture();" onmouseover="this.releaseCapture();">  
        <option>aaa</option>  
    </select>  

②或者使用如下的js脚本：

 

<select name="select123">  
    <option>aaa</option>  
</select>  
  
<script type="text/javascript">  
  
SetReadOnly(document.getElementById("select123"));  
function SetReadOnly(obj){  
    if(obj){  
        obj.onbeforeactivate = function(){return false;};  
        obj.onfocus = function(){obj.blur();};  
        obj.onmouseover = function(){obj.setCapture();};  
        obj.onmouseout = function(){obj.releaseCapture();};  
    }  
}  
  
</script> 

①②使用起来相对于不太好用，文章前者更实用。