Odd Safari 비디오 "로드"동작

Question

버튼을 클릭하여 소스 태그의 src 속성을 변경 한 다음 플레이어 요소에로드를 호출하여 작동하는 내 사이트의 한 페이지에 간단한 비디오 플레이어를 작성했습니다. 비디오 요소는 다음과 같습니다

<video id="player" title="Video 1" controls width="600" height="480" preload="metadata"> 
     <source src="videos/english.mp4" type="video/mp4" /> 
     <source src="videos/english.webm" type="video/webm" /> 
     <source src="videos/english.ogv" type="video/ogg" /> 
     <object type="application/x-shockwave-flash" data="plugins/flash/player.swf" 
    width="600" height="480"> 
     <param name="movie" value="plugins/flash/player.swf" /> 
     <param name="allowfullscreen" value="true" /> 
     <param name="allowscriptaccess" value="always" /> 
     <param name="flashvars" value="file=../../videos/english.mp4" /> 
     <p>Your browser can't play HTML5 video. <a href="videos/english.webm"> 
    Download it</a> instead.</p> 
     </object> 
    </video> 

그리고 클릭 이벤트에 relavent 스크립트는 다음과 같습니다 : 이것은 크롬 및 아마 파이어 폭스에 완벽하게 잘 작동

$(".playerControl").live("click tap",function(){ 

     // If the player isn't playing this divs video 

     if($("#player").data('currentVideo') != $(this).data('videoID')){ 

      // Swap active button states 

      $(".playerControl.active").removeClass('active'); 
      $(this).addClass('active'); 

      // Pause the current video and swap the content, then load the player 

      $("#player")[0].pause(); 
      $("#player").html($(this).data('innerHTML')); 
      $("#player").data({ 
       innerHTML: $(this).data('innerHTML'), 
       currentVideo: $(this).data('videoID') 
      }); 
      $("#player")[0].load(); 
      updateBackup(); 

     }  
    }); 

하지만 이상한 문제가 때 온다 나는 이것을 사파리에서 사용한다. 첫 번째 동영상이 표시되지만 재생하려고하는 모든 두 번째 동영상은로드를 시도하지 않습니다. 콘솔에서 플레이어에 "로드"를 호출해도 결과가 나타나지 않지만 플레이어의 검사 결과 소스가 정확한지 알 수 있으며 작동하지 않는 비디오 이후에 그것을 클릭하면 비디오가 재생됩니다.

나는 혼란스럽지 않지만 기본적으로 사파리는 내가 연주하려고하는 다른 모든 비디오를로드하지 않기를 바랄 뿐이며, 파일 자체를 재생하는 데 문제가 없다. 나는 그것이 작동하도록하기 위해 전화해야하는 몇 가지 추가 기능이 있다는 느낌이 들지만 확실하지 않습니다.

업데이트 : 어떤 버튼이 클릭되었는지에 관계없이 실행하기 위해 click 이벤트를 다시 작성했으며 비디오 자체가 아니라 클릭마다 비디오를로드하는 데 문제가 있습니다.

업데이트 2 : 비디오 html을 지우고 새 html을 삽입하기 전에로드하여 몇 초를 추가하여 시도해 보았습니다.이 줄을 초기화하면 시간이 2/3까지로드되기 시작했습니다.

Answer 1

<video> 태그를 블록으로 감싸고 innerHTML을 다시 작성할 수 있습니다. 이 같은

뭔가 :

<div id="player-holder"> 
    <video id="player">...</video> 
</div> 

// rebuild player data and reload HTML. 
$("#player").html($(this).data('innerHTML')); 
$('#player-holder').html($('#player-holder').html()) 

이 <video> 요소를 다시 작성하고 Safari에서 문제에 도움이 될 수 있습니다.