Object doesn't support this property or method

Question

As titled, I'm getting this error on my site. I have checked through the IE8 developer debugging tool, and I have got the following code that caused the error.

<!-- slider js code start -->
<script type="text/javascript">
$().ready(function() {
    if(eval(document.getElementById('coda-slider-1')))
    {
        $('#coda-slider-1').codaSlider();
        //jQuery.noConflict(); var $j = jQuery;
    }
}); 

I have included the screenshoot from Chrome debugging tool.

http://img857.imageshack.us/i/javaerror.jpg

http://img204.imageshack.us/i/javaerror2.jpg

Please help me to figure it out.

Thank you.

Answer 1

Try this instead:

$(function() {
    if($('#coda-slider-1').size())
    {
        $('#coda-slider-1').codaSlider();
        //jQuery.noConflict(); var $j = jQuery;
    }
}); 

Your original code says "select nothing with jQuery, and apply this ready handler to it." The correct long-hand syntax would be:

$(document).ready(function() { ...

Also note that I have removed eval because it should never, ever be used, unless it can't possibly be avoided.

UPDATE

Looking at your error screenshots, it appears that jQuery is not defined (at least not with the $ alias. Have you included the script on your page? If so, are you calling jQuery.noConflict() before your ready handler is bound?

Try putting this script tag above both the code you posted, and the script tag for the coda slider:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>

UPDATE 2

As pointed out by kingjiv in the comments below, I was mistaken, and $().ready will work (though it is not recommended). I believe my first update, noting that jQuery appears not to be defined, is the actual issue here.