jQuery working in IE and Chrome but NOT FireFox

Scott Tremain
Scott Tremain used Ask the Experts™
on
I have the following Code. the divs display correctly in IE and Chrome, but nothing displays in FireFox
.......
 <script language="javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js" type="text/jscript"></script>
<script language="javascript" type="text/jscript">
    $(document).ready(function() {
        $("#myselectbox").bind('change', function() {
            switch ($("#myselectbox").val()) {
                case "1": $("#afdd").show(); $("#tr").hide(); $("#tribute").hide(); $("#misc").hide(); break;
                case "2": $("#afdd").hide(); $("#tr").show(); $("#tribute").hide(); $("#misc").hide(); break;
                case "3": $("#afdd").hide(); $("#tr").hide(); $("#tribute").show(); $("#misc").hide(); break;
                case "4": $("#afdd").hide(); $("#tr").hide(); $("#tribute").hide(); $("#misc").show(); break;
            }
        });
    });
  </script>
..............
<body>
..............
  <select id="myselectbox" >
        <option   >- Select One -</option>
        <option value="1">For the Annual Fund Drive</option>
        <option value="2">For the purchase of event tickets or registration</option>
        <option value="3">A Tribute to someone</option>
        <option value="4">An additional/misc. contribution for Helias Foundation</option>
  </select>
<div id="afdd" style="display: none">
...
</div>
<div id="tr" style="display: none">
...
</div>
 <div id="tribute" style="display: none">
...
</div>
<div id="misc" style="display: none">
...
</div>
...
 </body>
...

 
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
can we have a link to look at this on?
I got this working in firefox using this script
 <html>
 <head>
 <script language="javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
    $(document).ready(function() {
        $("#myselectbox").change(function() {
		alert($("#myselectbox").val());
            switch ($("#myselectbox").val()) {
                case "1": $("#afdd").show(); $("#tr").hide(); $("#tribute").hide(); $("#misc").hide(); break;
                case "2": $("#afdd").hide(); $("#tr").show(); $("#tribute").hide(); $("#misc").hide(); break;
                case "3": $("#afdd").hide(); $("#tr").hide(); $("#tribute").show(); $("#misc").hide(); break;
                case "4": $("#afdd").hide(); $("#tr").hide(); $("#tribute").hide(); $("#misc").show(); break;
				default: $("#afdd").hide(); $("#tr").hide(); $("#tribute").hide(); $("#misc").hide(); break;
            }
        });
    });
  </script>
  </head>

<body>

  <select id="myselectbox" >
        <option >- Select One -</option>
        <option value="1">For the Annual Fund Drive</option>
        <option value="2">For the purchase of event tickets or registration</option>
        <option value="3">A Tribute to someone</option>
        <option value="4">An additional/misc. contribution for Helias Foundation</option>
  </select>
<div id="afdd" style="display: none">
HELLO
</div>
<div id="tr" style="display: none">
HELLO2
</div>
 <div id="tribute" style="display: none">
HELLO3
</div>
<div id="misc" style="display: none">
HELLO4
</div>

Open in new window

I changed the script to type="text/javascript">, changed the event handler to just change instead of bind('change')<-this was probably not needed
I think what firefox was having problems with was the script type="text/jscript">

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial