IE capture option element onclick Aug08 '06

IE 6 doesn’t support this:

<select id="do">

    <option onclick="do('Do This')" value="Do This"> Do This </option>
    <option onclick="do('Do That')" value="Do That"> Do That </option>

</select>

This is aggravating, when you need to perform a certain function, dependent upon each option chosen from the list.

For example, if someone chooses "Do This" from the select list, I need a certain function to run. However, if someone chooses "Do That" from the select list, I need a different function to run.

Turns out IE only recognizes onchange.

So, instead of applying an onclick to each <option> element, we’ll apply a single onchange to the entire select list:

<select id="do" onchange="do( this.value )">

    <option value="Do This"> Do This </option>
    <option value="Do That"> Do That </option>

</select>

The JavaScript do function could look something like this:

function do( optionValue )
{
	switch( optionValue )
	{
		case "Do This" :
		
			// SPECIFIC CODE HERE
		
		break;
		
		case "Do That" :
		
			// SPECIFIC CODE HERE
		
		break;
	}
}

Categories: Browsers , JavaScript

Add Feedback (view all)

Leave feedback

Feedback

Input format: The editor controls below will assist with Markdown syntax.

Status

Sub-status

Your info

Doesnt work if you want to select the first item on the dropdown ... Read more.

Good point. Just put an empty <option> element as the very first list item. That way, the REAL first option still has to b ... Read more.

This dog bit me for like an hour. Hate IE... ... Read more.

Two remarks: onchange="do( document.getElementById("do").value )" is invalid, bacause it has double quotes enclosed in double quotes ... Read more.

And validate your feedback against html entities :) So the second remark should be: 2. There is no need of getElementById at all, just use 'this': ... Read more.

Got it Stoyan, thanks. I made those changes. ... Read more.

it doesn't work. i can't make that example working ... Read more.

Thank you very much for this information... And I hate IE!! I don't know how can Microsoft Create and support such a lousy browser! ... Read more.

Any way to include some kind of "else" in this script? So that if none of the "case" are true, it will run a different function? ... Read more.

Klaus, there is the "default:" part of the switch/case statement. ... case "Do That" : // SPECIFIC CODE HERE break; default: // ... Read more.

If you are looking for just the onclick and you are not using the drop down in a form this should work for you: ... Read more.

This time with the markdown syntax. If you are looking for just the onclick and you are not using the drop down in a form this should work for you ... Read more.

Thank you very much for the article! I hate IE ! :) ... Read more.

Popular Pages

  1. Fast rounded corners in Photoshop (7424 recent visits)
  2. PHP – passing variables across pages (2558 recent visits)
  3. JavaScript set selected on load (2413 recent visits)
  4. Removing all child nodes from an element (1828 recent visits)
  5. Firefox 3 smart address bar: wildcard search (1755 recent visits)
  6. iPod songs out of order? (1314 recent visits)
  7. Britney - Everytime piano tab (1138 recent visits)
  8. MySQL LEFT JOIN syntax (884 recent visits)
  9. Firefox 3 smart address bar: wildcard search (722 recent visits)
  10. Date difference in MySQL (651 recent visits)

Similar Entries

Stats

542 unique visits since July 2008

Syndicate

Advertisements