2012-01-28 7 views
7

Chromeでビデオのサポートに問題があります。私のWebページはChromeで動作する必要があり、次のコードを使用して、Webページで動画を再生する必要があるかどうかを定期的に確認しています...しかし、問題は、要素を削除した後も、エレメント、新しいビデオのオーディオ、および古い重複を再作成します。Chromeの<video>要素を削除した後も音声が聞こえます

function showVideo() { 
     var video = videodata; 

     var videobox = $('#videobox').first(); 
     var videoplayer = $('#videoplayer').first(); 

     if (video.Enabled) { 
      if ((videoplayer.length > 0 && videoplayer[0].currentSrc != video.Location) || videoplayer.length == 0) { 
       videobox.empty(); 
       videobox.append('<video id="videoplayer" preload="auto" src="' + video.Location + '" width="100%" height="100%" autoplay="autoplay" loop="loop" />'); 
       videobox.show(); 
      } 
     } else { 
      videobox.hide(); 
      videobox.empty(); // Clear any children. 
     } 
    } 

どうすれば解決できますか?

ありがとうございます。

答えて

0

私の場合、ビデオを削除する前にビデオを一時停止する必要がありました。それ以外の場合、オーディオはまだバックグラウンドで再生されています。私が一時停止を使用した理由は、html5ビデオ要素にstop()関数がないためです。 (SimpleCodeの回答に基づいて)

 } else { 
     videobox.hide(); 

     // you can add something like this 
     $("#videoplayer").pause(); 

     videobox.empty(); // Clear any children. 
    } 
+0

に「ソース」タグを作成してみてください。 try:document.getElementById( "videoplayer")。pause(); – Sirber

+1

jQueryで直接DOM要素にアクセスするには、 '$( '#videoplayer')[0] .pause()'を実行する必要があります。 – Boaz

0

試してみてください。

関数showVideo(){ VARビデオ=ビデオデータ。

 var videobox = $('#videobox').first(); 
    var videoplayer = $('#videoplayer').first(); 

    if (video.Enabled) { 
     if ((videoplayer.length > 0 && videoplayer[0].currentSrc != video.Location) || videoplayer.length == 0) { 
      videobox.empty(); 
      videobox.append('<video id="videoplayer" preload="auto" src="' + video.Location + '" width="100%" height="100%" loop="loop" />'); 
      videobox.show(); 
      document.getElementById("videoplayer").play(); 
     } 
    } else { 
     document.getElementById("videoplayer").pause(); 
     videobox.hide(); 
     videobox.empty(); // Clear any children. 
    } 
} 
9

以下は、これを動作させるために最低限必要なものでした。ユーザーが戻るボタンを押したときに、Ajaxリクエストを生成している間、私は実際にバッファリングのためにストールを経験していました。 ChromeとAndroidブラウザでビデオを一時停止すると、バッファリングが維持されました。非同期非同期リクエストは、バッファリングが完了するのを待っています。

これをbeforepagehideイベントにバインドして固定しました。

$("#SOME_JQM_PAGE").live("pagebeforehide", function(event) 
{ 
      $("video").each(function() 
      { 
       logger.debug("PAUSE VIDEO"); 
       this.pause(); 
       this.src = ""; 
      }); 
}); 

これにより、ページのすべての動画タグが消去されます。

1

firsly HTMLで空の「ビデオ」タグを作成し、jQueryの

​​
関連する問題