Question

190

Javascript addEventListener onStateChange not working in IE

rated 0 times [ 193] [ 3] / answers: 1 / hits: 15937 / 14 Years ago, fri, may 21, 2010, 12:00:00

I have two colorbox popup boxes which show a YouTube video in each. When they're finished playing, I'm trying to have them automatically close the colorbox window. This code below works perfect in Firefox, but in IE I can't get addEventListener to work. I've tried attachEvent with no success. Can anybody offer any suggestions as to how to solve this? It seems simple but I'm exhausted trying to find a solution.

UPDATE 1:

Well, this is my current code. It works perfect in Firefox, but IE only outputs good. IE8 debugger doesn't report any errors either...

function onYouTubePlayerReady(playerId) {

  if (playerId && playerId != 'undefined') {

    if(playerId && playerId == 'ytvideo1'){

      var ytswf = document.getElementById('ytplayer1');

      alert('good');

    } else if(playerId && playerId == 'ytvideo2'){

      var ytswf = document.getElementById('ytplayer2');

    } else {

    }



    setInterval('', 1000);

    ytswf.addEventListener('onStateChange', 'onytplayerStateChange');

    alert('great');

  }

}





function onytplayerStateChange(newState) {

  alert('amazing');

  if(newState == 0){

    $.fn.colorbox.close();

    alert('perfect');

  }

}

Update 3: Solution

Simply put onComplete in my colorbox and put the swfobject in that and it worked perfectly in IE.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

dominickmackenziet

Add To Favorites

Follow

Total Points: 583

Total Questions: 101

Total Answers: 117

Location: Saint Lucia

Member since Wed, Feb 8, 2023

1 Year ago

dominickmackenziet questions

1 How to keep user logged after browser closing in React - Express?

Fri, May 20, 22, 00:00, 2 Years ago

1 Why do I get an Unhandled Promise Rejection with await Promise.all

Tue, Jun 1, 21, 00:00, 3 Years ago

1 Convert Maybe< string>[]' to 'string[]

Wed, Apr 7, 21, 00:00, 3 Years ago

1 (0 , _reactRouterDom.useHistory) is not a function

Fri, Feb 12, 21, 00:00, 3 Years ago

1 How to execute API call after entering 3 characters in field?

Fri, Aug 7, 20, 00:00, 4 Years ago

View All

answered 14 Years ago jamilab · Accepted Answer

from testing in IE it looks like the reference you are using

ytswf = document.getElementById('ytplayer1');

is assigned before the actual swf object is loaded, so IE thinks you are referring to a simple div element

you need to run this code

function onYouTubePlayerReady(playerId) {

  ytswf = document.getElementById(ytplayer1);

  ytplayer.addEventListener(onStateChange, onytplayerStateChange);

}

right after you call

swfobject.embedSWF(http://www.youtube.com/v/SPWU-EiulRY?

hl=en_US&hd=0&rel=0&fs=1&autoplay=1&enablejsapi=1&playerapiid=ytvideo1,

popupVideoContainer1, 853, 505, 8, null, null, params, atts);

before you close out that $(function()

and place var ytswf;
right after the <script>
instead of further down