Question

I'm currently using the following jQuery plugin: jQuery OEmbed. This plugin works great in FF, Chrome, and Safari. However, I am having an issue in IE7. I have stripped my code down to very bare-bones, but still can't figure out what would be causing the following error:

Error: Object doesn't support this property or method.

The line the error is referring to is:

  $("#container").oembed("http://www.youtube.com/watch?v=nue4pvzuyOo");

Here is my HTML (again, very basic):

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
    <title>jquery-oembed explicit insert example</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>  
    <script type="text/javascript" src="oe.js"></script>
  </head>
  <body>
   <script type="text/javascript">
    $(document).ready(function() {
            $("#container").oembed("http://www.youtube.com/watch?v=nue4pvzuyOo");

    });
  </script>
 <div id="container"></div>
 </body>
 </html>

The javascript for the plugin can be found here.

Interestingly enough, this error does NOT occur in IE8-- only IE7.

Any ideas on what might be causing this error?

Was it helpful?

Solution

JSLint reports that, among other problems, the plugin code you linked to has an extra comma inside an object literal. Correcting this seems to fix it in IE7.

The fix:

// Plugin defaults
$.fn.oembed.defaults = {
    maxWidth: null,
    maxHeight: null,
            embedMethod: "replace", // "auto", "append", "fill"
};

changes to:

// Plugin defaults
$.fn.oembed.defaults = {
    maxWidth: null,
    maxHeight: null,
            embedMethod: "replace" // "auto", "append", "fill"
};

Note the comma after "replace".

Working demo: http://jsbin.com/oxitu

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top