友诺网--SOHO乐园，工作社区

select 没有readonly属性，使用desibled又无法传值，因此现在使用JS方法模拟实现。

简单说两种方式，实质是一样的，一种简介明了，一种稍显复杂

实质都是用：

onmousemove="this.setCapture();" onmouseout="this.releaseCapture();" onfocus="this.blur();"

这句代码来控制用户无法选择和更改该控件的值

方法一：

一、先说简单的（平时都用简单的，但是有大量select控件需要做readonly处理时用复杂的更简单）

<select  onmousemove="this.setCapture();" onmouseout="this.releaseCapture();" onfocus="this.blur();"> 
 
<option selected >aaa</option> 
 
<option>bbb</option> 
 
</select>     

方法二：

二、贴一个复杂的，就是把变化放入js，来实现而已，多时候有用，另外只在脚本控制时候用

该方法转自CSDN博客，http://blog.csdn.net/lengyueqinghui/archive/2009/08/18/4457660.aspx
 

function 
 
// set all input/select/textarea readonly   
 
function allReadonly(){   
 
    // input readonly   
 
    var inputEle = document.getElementsByTagName("input");   
 
    for(var i=0; i<inputEle.length; i++){   
 
        inputEle[i].setAttribute("readonly","true",0);   
 
        inputEle[i].onclick = function setClickFalse(){return false;}   
 
        inputEle[i].onfocus = function setFocusFalse(){return false;}   
 
        inputEle[i].onblur = function setBlurFalse(){return false;}   
 
    }   
 
    // select readonly   
 
    var selectEle = document.getElementsByTagName("select");   
 
    for(var i=0; i<selectEle.length; i++){   
 
        setReadOnly(selectEle[i]);   
 
    }   
 
    // textarea readonly   
 
    var textareaEle = document.getElementsByTagName("textarea");   
 
    for(var i=0; i<textareaEle.length; i++){   
 
        textareaEle[i].setAttribute("readonly","true",0);   
 
    }   
 
}   
 
  
 
// select readonly   
 
function setReadOnly(obj){   
 
    obj.onmouseover = function(){   
 
        obj.setCapture();   
 
    }   
 
    obj.onmouseout = function(){   
 
        obj.releaseCapture();   
 
    }   
 
    obj.onfocus = function(){   
 
        obj.blur();   
 
    }   
 
    obj.onbeforeactivate = function(){   
 
        return false;   
 
    }    
 
}   
 
  
 
// select readonly rollback   
 
function rollBack(obj){   
 
    obj.onmouseover = function(){   
 
    }   
 
    obj.onmouseout = function(){   
 
    }   
 
    obj.onfocus = function(){   
 
    }   
 
    obj.onbeforeactivate = function(){   
 
    }    
 
}  

以上来自http://lava83.blog.163.com/blog/static/31759993201012533915991/

有用，有效过。网上另有一种方法见下面：

今天在做一个页面的时候，遇到一个问题，添加和更新使 用同一个页面，当添加的时候，select可以正常使用，如果是更新，那么要求select的值是指定的，并且不可使用，保存时，该控件的值可以正常保 存，大家知道select控件没有readonly属性，但是我们还需要用到该功能，该如何实现呢？
         上网搜索了一下，发现一种不错的方法，贡献给大家，代码如下：
    <select name="projInveSour.phaseType" <c:if test='${method eq "update"}'> onbeforeactivate="return false" onfocus="this.blur()" onmouseover="this.setCapture()" onmouseout="this.releaseCapture()" </c:if>>
        <option value="">全部</option>
        <option value="立项" <c:if test='${projInveSourForm.projInveSour.phaseType eq "立项"}'>selected</c:if>>立项</option>
        <option value="初设" <c:if test='${projInveSourForm.projInveSour.phaseType eq "初设"}'>selected</c:if>>初设</option>
       </select>
红色部分为关键代码，大家参考一下，呵呵

来自：http://www.blogjava.net/sword/articles/278054.html