onchange event handler and select tags

[yawnmoth]

http://www.frostjedi.com/terra/scripts/demo/select.html

When I select an item from the drop down menu, with the mouse, that
selection appears in the div section below.

When, however, I double click the drop down menu and then browse
through the entries with the up / down arrow on the keyboard, the
selection does not appear in the div. In IE7 it does but not in
Firefox 2. Any ideas as to why and what I can do fix it?

 

[yawnmoth]

http://www.frostjedi.com/terra/scripts/demo/select.html

When I select an item from the drop down menu, with the mouse, that
selection appears in the div section below.

When, however, I double click the drop down menu and then browse
through the entries with the up / down arrow on the keyboard, the
selection does not appear in the div. In IE7 it does but not in
Firefox 2. Any ideas as to why and what I can do fix it?

Also, any ideas as to why that page doesn't validate at
validator.w3.org?:

http://validator.w3.org/check?uri=h...(detect+automatically)&doctype=Inline&group=0

 

[David Mark]

http://www.frostjedi.com/terra/scripts/demo/select.html

When I select an item from the drop down menu, with the mouse, that

It is not a drop-down menu. It is a select element.

selection appears in the div section below.

When, however, I double click the drop down menu and then browse

You mean when you focus the select. Double-clicking does nothing
special. Clicking it twice in succession opens and closes the option
list.

through the entries with the up / down arrow on the keyboard, the
selection does not appear in the div. In IE7 it does but not in
Firefox 2. Any ideas as to why and what I can do fix it?

Change this:

onchange="document.getElementById('div').innerHTML =
document.getElementById('form').demo.value"

To this:

onchange="document.getElementById('div').innerHTML = this.value"

 

[yawnmoth]

You mean when you focus the select. Double-clicking does nothing
special. Clicking it twice in succession opens and closes the option
list.

I never implied double-clicking did anything special. You do,
however, need to double-click to close the select whilst still leaving
it focused to see the changes the select makes (since the div that's
being changed would be covered up by an open select).

Change this:

onchange="document.getElementById('div').innerHTML =
document.getElementById('form').demo.value"

To this:

onchange="document.getElementById('div').innerHTML = this.value"

Doesn't seem to make it behave any differently:

http://www.frostjedi.com/terra/scripts/demo/select2.html

 

[David Mark]

I never implied double-clicking did anything special. You do,
however, need to double-click to close the select whilst still leaving
it focused to see the changes the select makes (since the div that's
being changed would be covered up by an open select).






Doesn't seem to make it behave any differently:

http://www.frostjedi.com/terra/scripts/demo/select2.html

The onchange event doesn't fire in FireFox (or Windows Safari) until
the element loses focus. This is correct per the w3c. It seems like
it shouldn't fire when clicking an option in the list either.

So the question arises, what are you trying to accomplish with this?
If you want cross-browser consistency, you will need a different
design.

 

[Thomas 'PointedEars' Lahn]

Also, any ideas as to why that page doesn't validate at
validator.w3.org?:

http://validator.w3.org/check?uri=h...(detect+automatically)&doctype=Inline&group=0

The ability to read can be of great advantage:

| Line 12, Column 120: document type does not allow element "select" here;
| [...]

You should also enable Show Source and Verbose Output when validating there.


PointedEars