[Mozile] 0.8: nesting contentEditable = "false"

Short, Tom TShort at eprisolutions.com
Wed Jun 7 22:15:07 EDT 2006


Mozile 0.8 looks like it's coming along great. One interest I have is
being able to have an uneditable section inside of an editable section.
This is mostly so that the noneditable sections can include buttons and
inputs that the user can interact with. 

I tried adding the following inside of the editable div in the
basic.html that comes with Mozile 0.8:

<div contentEditable="false" style="border: 1px solid blue;">
  Nested div with contentEditable="false": You can't edit this
section!!!
  <a href="http://google.com">google.com</a>
  more text
  <input name="myInput"></input>
  <input name="myButton" type="button" value="Push me"
    onClick="alert('button pushed')"></input>
  more text
</div>  

I found that it mainly works (editing is indeed disabled) except for the
following:

(*) Under Firefox 1.5.0.4 and IE6, when I select the input box and type,
I get Mozile errors in mozile.event.handle. I assume that Mozile should
ignore these keypresses when in a contentEditable="false" section. 

(*) In Firefox, if you try to arrow-key past the noneditable section,
the cursor gets "stuck" in the noneditable part. In IE, it more
naturally jumps over the noneditable section.

A bit related to this last point, page-up and page-down act a bit weird
in Firefox. If I hit page-up near the top of an editable section, the
cursor will leave the editable section and jump somewhere to the
noneditable section above and get "stuck"; the cursor is still there and
blinking, but it won't move.

- Tom


More information about the Mozile mailing list