IE的jQuery问题

Question

i am having problems with Jquery in IE, the code is not working, can any one help me.

http://efm.net.au/component/content/article/54

please check this in IE and FF (or opera, safari, chrome) and select state, and you will see that clubs get loaded but do not show up in IE, but they show up in FF.

Please help its kind of urgent. thanks

    function loadClub()
{




  var st = document.getElementById("State").value;

  if(st != "Select State")
  {
    jQuery("#loaderBox").css("display","block");
//alert(document.getElementById("Club").innerHTML);
//alert($("#State").val());
/*$("div#Club_container").remove();*/

setTimeout('jQuery(".club-drop input").remove();',100);
setTimeout('jQuery("#Club_container").remove();',100);


if (window.XMLHttpRequest)

  {// code for IE7+, Firefox, Chrome, Opera, Safari

  xmlhttp=new XMLHttpRequest();

  }

else

  {// code for IE6, IE5

  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

  }

xmlhttp.onreadystatechange=function()

  {

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

  {/*
$(".state-drop input#State_input").remove();
$("div#State_container").remove();
$(".club-drop input#Club_input").remove();
$("div#Club_container").remove();*/
//setTimeout('$(".state-drop").remove()',500);

if(jQuery("#club1").length > 0)
{

  document.getElementById("club1").innerHTML=xmlhttp.responseText;
   document.getElementById("club2").innerHTML=xmlhttp.responseText;
    document.getElementById("club3").innerHTML=xmlhttp.responseText;

}else{
    document.getElementById("Club").innerHTML=xmlhttp.responseText;


}
//jQuery("div.state-drop").css("border","none");
jQuery("div.state-drop span").css("display","none");
     jQuery('.efm-text input[type="submit"]').removeAttr('disabled');


    if(jQuery("#club1").length > 0)
{
setTimeout("jQuery('#club1').selectbox()",100);
setTimeout("jQuery('#club2').selectbox()",100);
setTimeout("jQuery('#club3').selectbox()",100);

}else{
setTimeout("jQuery('#Club').selectbox()",100);
    //jQuery('#Club').selectbox();
}

jQuery("#loaderBox").css("display","none");

    }

  }





xmlhttp.open("GET","/club/state-club.php?state="+st,true);

xmlhttp.send();


    }else{
      setTimeout('jQuery(".club-drop input").remove();',100); 
      //jQuery("div.state-drop").css("border","1px solid red");
      jQuery("div.state-drop span").css("display","block");
      jQuery("div.state-drop span").css("color","red");

      jQuery('.efm-text input[type=submit]').attr('disabled', 'disabled'); 
        if(jQuery("#club1").length > 0)
        {

         document.getElementById("club1").innerHTML="Select State First";
   document.getElementById("club2").innerHTML="Select State First";
    document.getElementById("club3").innerHTML="Select State First";

    setTimeout("jQuery('#club1').selectbox()",100);
setTimeout("jQuery('#club2').selectbox()",100);
setTimeout("jQuery('#club3').selectbox()",100);

        }else{
       document.getElementById("Club").innerHTML="Select State First";
    setTimeout("jQuery('#Club').selectbox()",100);
        }

    }


}

Answer 1

1 - Upgrade to the latest version of jQuery. I have never faced any cross browser issues with jQUery.

2 - Replace your ajax code with jQuery code.

E.g -

     $.post("/someapp/login.do",$("#loginForm").serialize(), function(data) {
                    // Callback code
        $('#loginDiv').html(data);
    });