IE支援的HTML元素的DISABLE屬性在NETSCAPE4.76中的實現

fightplane發表於2007-08-16
HTML

1.     相關的html元素

(1)   text , edit , password , textarea

(2)   radio , checkbox

(3)   select

2.     IE中的寫法

(1)   document.form_name.text_name.disabled = true;

document.form_name.edit_name.disabled = true;

document.form_name.password_name.disabled = true;

document.form_name.textarea_name.disabled = true;

(2)   document.form_name.radio_name[i].disabled = true;

document.form_name.checkbox_name[i].disabled = true;

(3)   document.form_name.select_name.disabled = true;

3.     Netscape4.76中的寫法

(1)   document.form_name.text_name.disabled = true;

document.form_name.edit_name.disabled = true;

document.form_name.password_name.disabled = true;

在相應的text , edit , password , textarea 元素上新增對focus事件處理的方法:onfocus=”disableElements(this)”

function disableElements(obj)

{

if(obj.disabled)

        {

        obj.blur();

        }

}

(2)   document.form_name.radio_name[i].disabled = true;

document.form_name.checkbox_name[i].disabled = true;

在相應的radio , checkbox元素上新增對mousedown事件處理的方法:onclick=”return disableElements(this)”

function disableElements(obj)

{

if(obj.disabled)

        {

        obj.checked=false;

       return false;;

        }

}

(3)   document.form_name.select_name.disabled = true;

在相應的select元素上新增對change事件進行處理的方法:onchange=”disableElements(this)”

function disableElements(obj)

{

        if (obj.disabled)

      {

      for (var i=0; i<obj.options.length; i++)

      {

         obj.options[i].selected = obj.options[i].frozenStatus;

       (obj.options[i].selected = false;這樣寫也可以.)

      }

      }

}

最後我附上一個例子,這個例子在IE6.0和Netscape4.76下測試通過!

<html>

<body>

<form>

<br>Test:<input type="text" name="t1" onfocus="disableText(this)">

<br>Edit:<input type="edit" name="t2" onfocus="disableEdit(this)">

<br>Textarea:<textarea name="t3" onfocus="disableTextarea(this)"></textarea>

<br>Password: <input type="password" name="t4" onfocus="disablePassword(this)">

<br>Radiobutton: <input type="radio" name="t5" onmousedown="return disableRadio(this)">

<br>Checkbox: <input type="checkbox" name="t6" onclick="return disableCheck(this)">

<br>Defaul disabled Checkbox: <input type="checkbox" disabled name="t8" onmousedown="return disableCheck2(this)">

<br>Select:

<select name="t7" onchange=" ChangeSelect(this)">

<option> one

<option> two

<option> three

<option> four

</select>

 

<br><input type="button" value="Enable/Disable" onClick="change()">

</form>

</body>

</html>

 

<script language="javaScript">

function disableText(obj)

{

if(obj.disabled)

obj.blur();

}

 

function disableEdit(obj)

{

if(obj.disabled)

obj.blur();

}

 

function disablePassword(obj)

{

if(obj.disabled)

obj.blur();

}

 

function disableTextarea(obj)

{

if(obj.disabled)

obj.blur();

}

 

function disableRadio(obj)

{

          if(obj.disabled)

          {

                    obj.checked=false;

                    return false;

           }

}

 

function disableCheck(obj)

{

        if(obj.disabled)

       {

                 obj.checked=false;

                 return false;

       }

}

 

function disableCheck2(obj)

{

              obj.disabled=true;

              if(obj.disabled)

              {

                      obj.checked=false;

                      return false;

               }

}

 

function ChangeSelect(obj)

{

   if (obj.disabled)

   {

      for (var i=0; i<obj.options.length; i++)

      {

         //obj.options[i].selected = obj.options[i].frozenStatus;

obj.options[i].selected = false;

(這兩種寫法都是可以的)

      }

  

   }

 

}

 

function change()

{

document.forms[0].t1.disabled=!document.forms[0].t1.disabled;

 

document.forms[0].t2.disabled=!document.forms[0].t2.disabled;

document.forms[0].t3.disabled=!document.forms[0].t3.disabled;

document.forms[0].t4.disabled=!document.forms[0].t4.disabled;

document.forms[0].t5.disabled=!document.forms[0].t5.disabled;

document.forms[0].t6.disabled=!document.forms[0].t6.disabled;

document.forms[0].t7.disabled=!document.forms[0].t7.disabled;

 

document.forms[0].t1.value="";

document.forms[0].t2.value="";

document.forms[0].t3.value="";

document.forms[0].t4.value="";

 

document.forms[0].t5.checked=false;

document.forms[0].t6.checked=false;

document.forms[0].t7.value="";

for (var i=0; i<document.forms[0].t7.options.length; i++)

      {

        //document.forms[0].t7.options[i].selected = document.forms[0].t7.options[i].frozenStatus;

document.forms[0].t7.options[i].selected = false;

}

}

</script>

 

相關文章