CODEWITHSUNDEEP
javascriptjqueryinternet-exploreryoutube
Samuel
Samuel

Reputation: 3801

Can't get object attribute in IE8

I have following problem that I can't figure out. I a homepage on my WP blog that contains some youtube videos. My task is to get all youtube URLs from youtube objects on the page.

So I did something like this:

jQuery("object").each(function() {
  $ytbURL = jQuery(this).find("embed").attr("src");
  $ytbID = $ytbURL.match(...); //here I got error from IE8 that ytbURLis null or not and object
});

On FF it works flawlessly.

Update 15/12: Here are the code samples.

IE8 - Developer tools:

<OBJECT codeBase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" classid=clsid:d27cdb6e-ae6d-11cf-96b8-444553540000 width=320 height=267><PARAM NAME="_cx" VALUE="8466"><PARAM NAME="_cy" VALUE="7064"><PARAM NAME="FlashVars" VALUE=""><PARAM NAME="Movie" VALUE="http://www.youtube.com/v/TDlqMuGqTyE?fs=1&amp;hl=en&amp;fs=1&amp;rel=0"><PARAM NAME="Src" VALUE="http://www.youtube.com/v/TDlqMuGqTyE?fs=1&amp;hl=en&amp;fs=1&amp;rel=0"><PARAM NAME="WMode" VALUE="Transparent"><PARAM NAME="Play" VALUE="0"><PARAM NAME="Loop" VALUE="-1"><PARAM NAME="Quality" VALUE="High"><PARAM NAME="SAlign" VALUE="LT"><PARAM NAME="Menu" VALUE="-1"><PARAM NAME="Base" VALUE=""><PARAM NAME="AllowScriptAccess" VALUE=""><PARAM NAME="Scale" VALUE="NoScale"><PARAM NAME="DeviceFont" VALUE="0"><PARAM NAME="EmbedMovie" VALUE="0"><PARAM NAME="BGColor" VALUE=""><PARAM NAME="SWRemote" VALUE=""><PARAM NAME="MovieData" VALUE=""><PARAM NAME="SeamlessTabbing" VALUE="1"><PARAM NAME="Profile" VALUE="0"><PARAM NAME="ProfileAddress" VALUE=""><PARAM NAME="ProfilePort" VALUE="0"><PARAM NAME="AllowNetworking" VALUE="all"><PARAM NAME="AllowFullScreen" VALUE="true">
<embed type="application/x-shockwave-flash" width="320" height="267" src="http://www.youtube.com/v/TDlqMuGqTyE?fs=1&amp;hl=en&amp;fs=1&amp;rel=0" allowfullscreen="true" wmode="transparent"></embed></OBJECT>

Wordpress:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="320" height="267" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="wmode" value="transparent" /><param name="allowfullscreen" value="true" /><param name="src" value="http://www.youtube.com/v/TDlqMuGqTyE?fs=1&amp;hl=en&amp;fs=1&amp;rel=0" /><embed type="application/x-shockwave-flash" width="320" height="267" src="http://www.youtube.com/v/TDlqMuGqTyE?fs=1&amp;hl=en&amp;fs=1&amp;rel=0" allowfullscreen="true" wmode="transparent"></embed></object>

Looks like IE8 does some changes to source HTML or maybe it's the way how Developer Tools displays it?

Thanx

Sam

Upvotes: 1

Views: 2021

Answers (2)

Samuel
Samuel

Reputation: 3801

Ok guys, after we figured out that IE doesn't support <embed> tag, the solution was to search <param> tag with source URL inside <object>. So here's the code that worked for me:

jQuery("object").each(function(){
        var $params = jQuery(this).children('param');
        $params.each(function() {
                if((jQuery(this).attr('name')) == 'src') {
                    $ytbURL = jQuery(this).val();
                    return;
                }
        });

});

Use this on your own risk :). Now I still need to figure out how to autoplay new object, but this is another story :)...

Thanx to all people that helped me on the issue, especially Blender.

Upvotes: 0

Blender
Blender

Reputation: 298226

I would try using jQuery's awesome $ function instead of jQuery, and see if it works:

$('object').each(function()
{
  $ytbURL = $(this).find('embed').attr('src');
  $ytbID = $ytbURL.match(...);
});

I doubt there would be a difference, but it might work. Oh, and here's a really useful YouTube video ID grabber regex, just in case you need it: (?<=v=)[a-zA-Z0-9-]+(?=&)|(?<=[0-9]/)[^&\n]+|(?<=v=)[^&\n]+.

Good luck!

Try this. Also, could you give us an example of the DOM jQuery is parsing? It could be because there are multiple <embed> tags, so jQuery(this).find('embed') would return an array, not a single object.

jQuery('object').each(function()
{
  $ytbURL = jQuery(this).children('embed:eq(0)').attr('src');
  $ytbID = $ytbURL.match(...);
});

Upvotes: 1

Related Questions