日期:2014-05-16 浏览次数:20354 次
?????? 很多时候,页面上的一些项目是不能够进行编辑的。这时候,我们可以用2种方法来实现。
1.设置readonly属性
? 例如:
????????
<td align="left">
??? ????? ??? <input type="text" id="usrId" name="usrId" value="${form.usrId}" readonly
/>
??? ????? </td>
?? 设置readonly属性后,控件的背景色和未设置该属性的控件背景色是一样的。因此,为了更好的界面友好性,我们修改上面的代码
???????? <input type="text" id="usrId" name="usrId" value="${form.usrId}" style="background:#FFFF00" readonly />
??? readonly属性用于input,textarea等。
2.设置disabled属性
?? disabled属性适用于所有控件,例如input,textarea,select等。且设置后背景色为灰色,点击控件不能得到焦点。
???????? <input type="text" id="usrId" name="usrId" value="${form.usrId}" disabled />
3.readonly和
?
disabled的区别
?? readonly没有背景色 disabled有
?? readonly可以获得焦点 disabled不能
?? readonly可以在action中获得值 disabled不能
?
?? 要想在Form提交后,让设置了disabled属性的属性值能在action中得到,那么我们需要在form提交前设置disabled = false
4.如果页面上需要设置disabled属性的控件比较多,那么可以Form中onload下面的function
function disableOcx()
??? ??? ??? {
??? ??? ??? ??? var form = document.forms[0];
??? ??? ??? ??? for (var i = 0; i < form.length; ++i) {
??? ??? ??? ??? ??? var element = form.elements[i];
??? ??? ??? ?????
??? ??? ??? ??? ??? if (element.name) {
??? ??? ??? ??????? ??? if (element.nodeName == "INPUT") {
??? ??? ??? ????????? ??? ??? if(element.name != 'return'){
??? ??? ??? ????????? ??? ??? ??? element.disabled="true";
??? ??? ??? ??????????? ??? ??? element.readOnly = true;
??? ??? ??? ????????? ??? ??? }
??? ??? ??? ??????? ??? }
??? ??? ??? ??????? ??? else if (element.nodeName == "SELECT") {
??? ??? ??? ????????? ??? ??? element.disabled = true;
??? ??? ??? ??????? ??? }
??? ??? ??? ??????? ??? else if (element.nodeName == "TEXTAREA") {
??? ??? ??? ????????? ??? ??? element.disabled = true;
??? ??? ??? ??????? ??? }
??? ??? ??? ????? ??? }
??? ??? ??? ??? }??
??? ??? ??? }