Jquery IE Error

I have some Jquery written that works fine in firefox and chrome but throws an ERROR in IE.

Here is the sections of code that when taken 开发者_开发技巧out allow the other parts of the script to be run correctly...(otherwise the entire file is not read by IE)

var product_qty_is_zero = ExternalCustom_product_qty_is_zero; //'import' external variable from view.phtml
var option_is_selected = false;
var options_exist = false;
if(  ($(".options-container-big").length > 0) || ($(".options-container-small").length > 0)  )
    options_exist = true;   

$('#main-button-btn-cart').mouseenter(function() {
        //@ controlling backorder message
        if(product_qty_is_zero)
        {
            $('#select-product-reminder').slideDown(300);
            $('#select-product-reminder').text("product is purchaseable but on backorder");
            $('#select-product-reminder').css("background-color", "#c3c3c3");
        }                                          
});

$('#main-button-btn-cart').click(function() {
    if(!option_is_selected && options_exist) 
        $('#select-product-reminder').slideDown(300);
    else
        productAddToCartForm.submit();
});



 $('#select-product-reminder').slideUp(300);
  option_is_selected = true;

 var image_info = ExternalCustom_image_info; //'import' variable from media.phtml
  var image_link;
  var $selected_value_variation = $('.selected').html();
  for (var i = 0; i < image_info.length; i++) 
  {
        if(image_info[i][0] == $selected_value_variation)
            image_link = image_info[i][1];
  }
  $('#main-image').attr("href", image_link);

If anyone could look over it and see if there are any errors that are common for IE to flag and give me some hints it would be greatly appreciated!

Note* I already tried the class and div extensions such as $('div.options-container-big') and $('div#main-button-btn-cart')

Only thing I can see without more info that might cause some hiccups:

productAddToCartForm.submit();

If IE doesn't know what that is, it'll likely fail. Try wrapping it in JQuery-safe selector syntax:

$(productAddToCartForm).submit();

or:

// Assuming you have a <form id="productAddToCardForm"...>
$('#productAddToCartForm').submit();

You've said that IE says that console is undefined on the line

if (console) { ... // Error if `console` is not defined anywhere

That's quite correct. console is not a guaranteed built-in object on browsers, although many browsers do provide it. You probably want

if (typeof console !== "undefined") { ...

...instead. There we're not taking the value, we're just checking whether it exists.

This is an area of JavaScript that can get a bit confusing, but basically, if you try to take the value of an unqualified reference that really isn't declared anywhere, e.g.

if (foo) { ...

...it's an error. The reason this can get confusing is that you could assign to foo in the exact same situation, and it would be valid (it would be The Horror of Implicit Globals, but valid). Similarly, you can happily take the value of an object property that has never been defined:

var obj = {};
if (obj.foo) { ... // Not an error, we just don't go into the body of the `if`

...because that's not an unqualified reference. But with unqualified references, it's an error.

So why is console unqualified on IE8 and IE9, both of which have console.log and such? Because IE8 and IE9 don't have console [or console.log] unless you have the developer tools open. Strange but true. Wrong, but true. :-) Opening the developer tools, which are basically a plug-in for IE8 and IE9, adds the console object on-the-fly. (More on that in this other question (and answer) here on Stack Overflow.)