I am going nuts on this. Am I just blind, or is there some bug either in my code or IE?
Nutshell version: I have a content editable div that is supposed to show its entry in red if it is not what it
started out with. This works, EXCEPT if the content is completely erased(!) character by character, starting from
the right(!). In that case, the color gets stuck on red. I've made a web page for this at
http://csaba.org/demoDiv.htm The uncommented version appears below.
The thing that makes this so massively weird to me is that the behaviour seems to stem from the way in which a
boolean variable is set. If you look at the code below, you'll see that nonEmpty is supposed to be a boolean. In
fact, the color value that the iff returns is correct, and it gets set, and evidently ignored. If the nonEmpty = ...
line is commented out, however, then the line above it takes over, which is doing the same thing as the commented out
line. With the difference that the font color is now reset properly.
I'd love to be enlightened on this or know where I can delve further.
Thanks,
Csaba Gabor from New York
The short form of the demo page follows:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML><HEAD>
<META http-equiv="content-type" content="text/html;charset=iso-8859-1">
<TITLE>color problem</TITLE>
<SCRIPT>
function divPrep() {
myDiv = document.getElementsByTagName("DIV")[0];
myDiv.saveText = myDiv.outerText;
}
function cellChange() {
var nonEmpty;
if (myDiv.outText!="") nonEmpty=true; else nonEmpty=false;
nonEmpty = (myDiv.outerText!="");
myDiv.style.color =(myDiv.saveText!=myDiv.outerText && nonEmpty) ? "red" : "";
}
</SCRIPT>
</HEAD>
<BODY onLoad="divPrep()">
<TABLE border=1><TR><TD><DIV accesskey=i contentEditable onKeyUp="cellChange()">DIV</DIV></TD></TR></TABLE>
</BODY>
</HTML>