Hi there, I have a javascript code below which seems to work in FF but not in IE. Could somebody tell me why it won't work in IE? Thanks <script> function switch1(span) { if (document.getElementById('1')) { var option=['1','2']; for(var i=0; i<option.length; i++) { obj=document.getElementById(option[i]); obj.style.display=(option[i]==span)? "block" : "none"; } } } </script> <div><label>changer</label><select name="password2"><option value="0" onclick="switch1('1')">Option 1</option><option value="1" onclick="switch1('2')" >Option 2</option></select></div> <span id="1" style="display:none"> hey </span> <span id="2" style="display:none"> hello </span> HTML:
Hi, the problem is that Internet Explorer does not support the onclick event on options. If you want to detect when the selection has changed, use the onchanged event of the select element. I made some other modifications in your code, because: - all span elements are initially hidden, but the selected one must be visible - when the selection is changed, the display style property of all options are modified. A better solution, if only the previously selected one and the current one is modified (if there are more than two options ...) <head> <script type="text/javascript"> // the value of the last selected option var selValue = null; function UpdateSpans (dropList) { // hide the previously selected span if (selValue) { var span = document.getElementById (selValue); span.style.display = "none"; } // store the value of the selected option selValue = dropList.value; // show the current span if (selValue) { var span = document.getElementById (selValue); span.style.display = "inline"; } } function Init () { var dropList = document.getElementById ("password2"); // show one of the spans based on the initially selected option UpdateSpans (dropList); } </script> </head> <body onload="Init ()"> <div> <label>changer</label> <select name="password2" id="password2" onchange="UpdateSpans (this)"> <option value="1" selected="selected">Option 1</option> <option value="2">Option 2</option> </select> </div> <span id="1" style="display:none">hey</span> <span id="2" style="display:none">hello</span> </body> Code (markup): I suggest you the following pages: onchange event, select element, onload event.