views:

65

answers:

1

This code results in an error at second line ($('boxes div.box'))

<script type="text/javascript">

    $(document).ready(function () {
        boxes = $('#boxes div.box');
        images = $('#images > div');
        boxes.each(function (idx) {
            $(this).data('image', images.eq(idx));
        }).hover(
            function () {
                boxes.removeClass('active');
                images.removeClass('active');
                $(this).addClass('active');
                $(this).data('image').addClass('active');
            });
    });

</script>

The error is "Object doesn't support this property or method". The same page works fine in Firefox and Chrome.

Anyone?

+5  A: 

Try declaring your variables for first-use with var:

        var boxes = $('#boxes div.box');
        var images = $('#images > div');
BoltClock
this actually worked, how come?
mare
You're supposed to declare variables that you use for the first time using `var` anyway — I would think IE chokes on trying to use undeclared variables.
BoltClock
As far as I can tell this works because IE is a lot stricter on things like this. In IE when a script comes across an error it will just stop dead, while in FF and Chrome they manage to intelligently work around it and continue running the script.
Ryan French
I thought it was because not declaring a variable means that you add the variable as a property to the `window` object... but I'm not sure why the `window` object can't take a jQuery object as a property?
Peter Ajtai