Jquery Noconflict Not Working In Ie8 Only

I have a website using the prootype framework and I am looking to use a jquery plugin. Everything works just not in IE8. It works in ie7 which amazes me. Any idea what maybe wrong?

Solution 1:

I've run into this also using jQuery-1.4.4.js. Everything works fine except in IE8. IE8 does not recognize jQuery() anything. I was able to resolve the problem by loading jQuery and running $.noconflict() prior to loading Prototype and it all runs fine on all my test browsers including IE8. This sequence is contrary to the jQuery documentation and therefore I'm nervous about it. Can't find anything on the jQuery site about it.

t22harris

Solution 2:

The only way I was able to fix this, for IE8 (which was the only one with the problem) and other browsers was to put jQuery and the noConflict() call in the head immediately after initializing the other library. Like so:

<script type="text/javascript" src="/path/to/prototype.js"></script>

<script type="text/javascript" src="/path/to/jquery.js"></script>

<script type="text/javascript">var $j = jQuery.noConflict(); </script>

... followed by any other scripts that use either jQuery or Prototype.

Solution 3:

I've been having a similar problem. The solution that I'm currently using is to save the $ variable in a temporary variable, loading jquery(I'm loading jquery from js code), running jquery dependent code (with jQuery.noConflict), the setting the $ variable back.

It's dirty, but it seem to have done the trick for me.

My function which adds jquery (if necessary) is:

functiongetJQueryAndGo(callback) {
    var thisPageUsingOtherJSLibrary = false;
    var tempDollar = $;
    // Only do anything if jQuery isn't definedif (typeof jQuery == 'undefined') {
        if (typeof $ == 'function') {
            thisPageUsingOtherJSLibrary = true;
        }
        loadToHead('script','http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js', function() {
            if (typeof jQuery=='undefined') {
                    //alert('Super failsafe - still somehow failed...')
            } else {
                jQuery.noConflict();
                (function($) {
                    callback($);
                })(jQuery);

            }
        });
    } 
    else 
    { // jQuery was already loaded
        jQuery.noConflict(); // This may not be necessary
        (function($) {
            callback($);
        })(jQuery);
    }

    $ = tempDollar;
}

The loadToHead simply loads the script into the head tag somewhere and runs the callback function when the script is loaded.

Most of this code I have found online and tweeked it. Unfortunately I don't remember where to give the credit as of now.

Solution 4:

Ive had a simular problem in the past and worked around it by using the emulate ie7 meta tag

<metahttp-equiv="X-UA-Compatible"content="IE=EmulateIE7" />

Im not sure if this is the best work around though.

Solution 5:

Just had the same problem. IE 8 does not like:

var jQuery = jQuery.noConflict();

changed it to:

var jq = jQuery.noConflict();

worked fine.