Question

So been fiddling around with this for a while now but still no luck.
I’ve tried changing jquery versions, tried doing the whole var $j = jQuery.noConflict();, tried rearranging JS/jquery scripts, tried the no caching thing suggested by jquery website but still my load() doesn’t work on IE8.

<a onclick="loadCont('canyou.php');">Can you help us</a>


function loadCont(file){
$j("#maincont").load(file);
alert(file);
return false;
}

As always it loads on every other browser except IE8. The alert() is there for IE8 debugging, and the file is passed successfully to the server with status 200 (checked with Fiddler2), its just not loaded into #maincont
I’ve tried different methods such as:

$j.ajaxSetup ({
            // Disable caching of AJAX responses
            cache: false
    });

    // Bind ajax call to click
    $j('a.loadlink').click(function(e) {
            $j('#maincont').load($j(this).attr('href') + ' #filecont');  // Dynamically load content from URL in href
            e.preventDefault();
    });

And commenting out all my other JS externel includes “styleswitcher.js and formcheck.js”. I know the jQuery is working correctly as I use a jQuery drop down menu. At the moment my current code looks like this, which works fine on every other browser….

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">var $j = jQuery.noConflict();</script>

<script type="text/javascript">

$(document).ready(function(){
        $j("#mcfrnav li").hover(
            function(){ $j("ul", this).fadeIn("fast"); }, 
            function() { } 
        );
    if (document.all) {
            $j("#mcfrnav li").hoverClass ("sfHover");
        }

    $j.fn.hoverClass = function(c) {
        return this.each(function(){
            $j(this).hover( 
                function() { $j(this).addClass(c);  },
                function() { $j(this).removeClass(c); }
            );
        });
    };    
    });

function loadCont(file){
$j("#maincont").load(file);
}

</script>

 <script src="styleswitcher.js" type="text/javascript"></script> 
 <script src="formcheck.js" type="text/javascript"></script>

<script type="text/javascript">

function imgError(id){
id.src = "photos/noimg.png";
id.onerror = "";
return true;
}

</script>

All or any help about the code or replies appreciated. Many thanks to all replies.

EDIT: Still looking for a fix for this 🙁

Answer 1

You’re using formcheck.js its based on mootools javascript if I’m not wrong. Please put your jQuery file on top and try.
Another thing you can do is instead of creating no conflict object you can directly jQuery. I’ve used formcheck and jQuery in a same page. Please refer http://www.mymegaenergy.com/enrollments It should work fine if you do these things.