View Full Version : How to disable DIV and content in Firefox?

07-14-2009, 03:18 PM
The following code works in IE but not Firefox.


I've also tried document.getElementById('myDiv').disabled=!document.getElementById('myDiv').disabled

Any ideas how I can get it to work in Firefox also?

Philip M
07-14-2009, 04:10 PM
Attributes in HTML are not inherited. There is no such thing as a 'disabled' attribute on <div>. So you are asking Firefox to do something against the standard. It is true that it works in IE - but it ought not to! :eek:

The following elements (only) support the disabled attribute: BUTTON, INPUT, OPTGROUP, OPTION, SELECT, and TEXTAREA.

Try this (not tested):-

var da =document.getElementById("myDiv");
var elInp = da.getElementsByTagName("input");
for (i=0; i<elInp.length; i++) {
elInp[i].disabled = true;

"When you've got a mountain to climb, you may as well throw everything into the kitchen sink straight away." - Football commentator.

07-14-2009, 04:22 PM
Well this function works after we doing the following:
da.getElementByTagName("input") shoud be da.getElementsByTagName("input")

and elInput.disabled = true should be

elInp[i] .disabled = true

Philip M, may I respectfully suggest that you test your code before posting it here.

Thank you.

Philip M
07-14-2009, 04:25 PM
Philip M, may I respectfully suggest that you test your code before posting it here.

Touche! :o But I did say "untested". :p I had already spotted getElementsByTagName("input") and corrected it a few seconds before your post.

07-14-2009, 04:31 PM
Hey buddy I did not mean any harm with it, but I got the same comment from you yesterday for posting an untested code.

The idea is not to criticize each other.
The point is this forum is to help solve each others' problems and learn from each other.

Sometimes you want to help so badly but you haven't got the time to even test your code.

So you write something (that is correct as an algorithm) but you make a typing mistake or something like that and this is not a big deal.

The main issue is that we are trying to help people and people helping us.

So either you have mentioned that the code is tested or not it is the same for me as long as you are helping solve a problem.

I did not want to be rude but I just wanted you to feel the impact of such a comment and I apologize for that.


Philip M
07-14-2009, 04:38 PM
ckeyrouz - no problem, and you are 100% right. No need at all to apologise. In fact I nearly always do test my code before posting (as you say, it is easy to make a typo), on this occasion I did not as I am not a FF enthusiast, and hence you caught me out! But the idea was OK!

In fencing, touché (French: touched) is used as an acknowledgement of a hit, called out by the fencer who is hit. Here I used it as a way of acknowledging a good response.

07-14-2009, 04:41 PM
Thank you.
By the way I am as good in french as in english, so I got it from the first time but I wanted to make sure that everything is clear.

07-14-2009, 04:41 PM
In my opinion, for FF and Opera it is possible to "simulate" disabled-like looking text using CSS attribute text-shadow.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<style type="text/css">
body {background: #111111;}
.disabledTxt {color: #ACA899; text-shadow: 1px 1px 1px #FFFFFF;}
<div id="myDiv" class="disabledTxt">Lorem ipsum dolor</div>
<script type="text/javascript">
/* for IE */
document.getElementById('myDiv').disabled = true;
AFAIK, the text-shadow attribute is supported by FF since version 3.5.

07-14-2009, 05:03 PM
Thanks for the replies.
Specifically what I'm trying to disable is a form label. I can get the drop-down disabled in both IE and FF, but the label remains enabled in FF.