JQuery IE удалить / добавить проблему

Question

У меня много проблем с Vimeo и IE. У меня есть пользовательские функции видео плеера, такие как YouTube - отображает одно видео за один раз с вариантами переключения видео.

Первая попытка: Держите каждое видео в div и показывайте / скрывайте его с помощью JQuery fadeIn / fadeOut. Работает в IE / FF / Chrome, за исключением IE, переключение между видео поддерживает воспроизведение как старого видео, так и нового. Неприемлемо.

Вторая попытка: удерживайте каждое видео в div и удаляйте / добавляйте каждое видео по мере необходимости. Но в IE видео не загружается во второй раз. Прекрасно работает в FF / Chrome.

Я чувствую, что перепробовал все, я в своем уме. JSFiddle: http://jsfiddle.net/4egZD/1/ (воспроизводит видео с Vimeo; моя вторая попытка удалить / добавить)

Любая помощь или альтернативы приветствуются.

Вот код для не-JSFiddle'rs

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

<script type="text/javascript">
$(document).ready(function () {

    // When any of our video description divs are clicked, play that video
    // for testing purposes, we only show one video
    // whenever a new video is clicked, we want to remove/append to stop the audio in IE
  $('#descript-1').click(function() {
      $("#video1" ).remove().appendTo('#videoHolder');
  });


});
</script>



<table border="1">
<tr>
<td style="background-color: #003388; color: white; font-weight: bold; padding: 2px; padding-left: 7px;" colspan="2">
<a name="videos">Watch Our Videos</a>
</td>
</tr>
<tr>
<td id="videoHolder" valign="top">

<div id="video1" ><object width="400" height="225"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=23864606&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=&amp;fullscreen=1&amp;autoplay=1&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=23864606&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=&amp;fullscreen=1&amp;autoplay=1&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="400" height="225"></embed></object>
</div>

</td>
<td style="margin-right: 5px; vertical-align:top;">
<div id="descript-1" style="width: 100%; margin: 5px; background-color: #999999; cursor: pointer;">
    <b>Play This Video</b><br />But why won't it play more than once in IE?
</div>

</td>
</tr>
</table>

Answer 1

Вы можете попробовать что-то вроде этого:

$('#descript-1').click(function() {
    var video = $("#video1");
    $("#video1" ).remove()
    video.appendTo('#videoHolder');
});

или

$('#descript-1').click(function() {
    var video = $("#video1").html();
    $("#video1" ).remove()
    $('#videoHolder').html("<div id='video1'>" + video + "</div>");
});

Я понятия не имею, будет ли это работать или нет, не имеет смысла, но так как все не имеет смыслав IE вы можете попробовать.

Также, какая проблемная версия IE?