OnClick Dropdown works in FireFox but not Chrome or IE?

Question

The following code works perfectly in Firefox, but not in IE or Chrome... Any ideas why?

<script type="text/javascript">
function display_div(show){
   document.getElementById('passenger1').style.display = "none";
   document.getElementById('passenger2').style.display = "none";
   document.getElementById('passenger3').style.display = "none";
   document.getElementById(show).style.display = "block";
}
</script>

<select name="#" id="#">
      <option selected="selected"> </option>
      <option onClick="display_div('passenger1');">1</option>
      <option onClick="display_div('passenger2');">2</option>
      <option onClick="display_div('passenger3');">3</option>
</select>

<div id="passenger1" style="display:none;"> hey, 1 works </div>
<div id="passenger2" style="display:none;"> hey, 2 works </div>
<div id="passenger3" style="display:none;"> hey, 3 works </div>

score 1 · Answer 1 · answered May 31 '11 at 21:56

1

move the "onClick" from options to the select element

<select onchange="this(this.selectedIndex)">
    <option value="passenger1">1</option>

answered May 31 '11 at 21:56

Trey

5,480
4
23
30

score 1 · Accepted Answer · answered May 31 '11 at 21:59

1

Move the onChange function

http://jsfiddle.net/WmEAp/

answered May 31 '11 at 21:59

josh.trow

4,861
20
31

Unfortunately this means your javascript call won't go off a second time if you select the same option. Anyone know of a good workaround for this? – DShook Mar 05 '12 at 19:48

score 0 · Answer 3 · answered May 31 '11 at 22:03

0

onclick on option is not a valid click handler. Use onchange on the select instead.

answered May 31 '11 at 22:03

Akhil Uddemarri

301
2
6

score 0 · Answer 4 · answered May 31 '11 at 22:03

IE and Chrome don't recognize events on option elements of a select. You can remove the onclick events from your options and add the following onchange event to your select element to get it to work with your current code:

onchange="display_div('passenger' + this.value);"

OnClick Dropdown works in FireFox but not Chrome or IE?

4 Answers4

Linked