OnClick Dropdown在FireFox中有效,但在Chrome或IE中不起作用?

问题描述

| 以下代码可在Firefox中完美运行,但不适用于IE或Chrome。
<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>
    

解决方法

        移动
onChange function
http://jsfiddle.net/WmEAp/     ,        将\“ onClick \”从选项移到选择元素
<select onchange=\"this(this.selectedIndex)\">
    <option value=\"passenger1\">1</option>
    ,        onclick on选项不是有效的点击处理程序。在选择上使用onchange。     ,        IE和Chrome无法识别select的选项元素上的事件。您可以从选项中删除onclick事件,并将以下onchange事件添加到select元素中,以使其与当前代码一起使用:
onchange=\"display_div(\'passenger\' + this.value);\"