UPDATE: The premise of this question turned out to be misguided. The problem does not happen unless the move is in response to a user-click. Please see here.
I have been knocking my head against a bug for a few days and am hoping someone can help.
I have a jquery script that makes calls to a jwplayer object ("myplayer") using the jwplayer javascript api. For example, to load myplayer with a particular video, I call:
myplayer.load('my_url');
This works fine in both firefox and internet explorer, so long as I don't first move the player to a different location in the DOM.
However, my script sometimes moves the player from location A to location B and then back to location A, before calling myplayer.load(). This works fine in firefox. But in internet explorer 9, I get an error on this line:
return eval(instance.CallFunction("<invoke name=\""+name+"\" returntype=\"javascript\">" + __flash__argumentsToXML(arguments,0) + "</invoke>"));
which is inside this function:
function __flash__addCallback(instance, name) {
instance[name] = function () {
return eval(instance.CallFunction("<invoke name=\""+name+"\" returntype=\"javascript\">" + __flash__argumentsToXML(arguments,0) + "</invoke>"));
}
}
If I trace what is happening in the internet explorer debugger, I see that myplayer.load('my_url') calls this.callInternal("jwLoad",u) in jwplayer.js, and it is apparently while executing this.callInternal("jwLoad",u) that the error occurs.
Details:
The html looks something like this:
<div id='stage'>
<div id='myplayer_wrapper'>
<object id='myplayer'>...</object>
</div>
</div>
<div id='holding-pen'></div>
When the player is not being used, I move its wrapper-div to the holding-pen:
var el = $('#myplayer_wrapper');
$('#holding-pen').append(el);
After moving the player's wrapper-div to the holding-pen, the html now looks like:
<div id='stage'></div>
<div id='holding-pen'>
<div id='myplayer_wrapper'>
<object id='myplayer'>...</object>
</div>
</div>
When I wish to use the player, I move its wrapper-div back to the stage-div:
var el = $('#myplayer_wrapper');
$('#stage).append(el);
After moving the player's wrapper-div to the stage-div, the html looks the same as it did originally:
<div id='stage'>
<div id='myplayer_wrapper'>
<object id='myplayer'>...</object>
</div>
</div>
<div id='holding-pen'></div>
On page load, I create the player-object and move it to the holding-pen. I then move it to the stage and load a video.
If the user clicks on, for example, an image-thumbnail, I move the video-player to the holding-pen and move the selected image to the stage.
If the user then clicks on a video-thumbnail, I retrieve the video-player from the holding pen and move it back to the stage. I then load the player with the selected video. This is where the "_flash_addCallback" problem occurs in internet explorer.
Does anyone have any insight into what may be going on? Or any suggestions for how I can get this to work in internet explorer?
Thank you very much!