元の問題を解決するのに役立つコードを見つけました。一部のコンテンツにビデオが含まれているタブ付きコンテンツのセクションがあります。ビデオを再生してから別のタブを選択すると、ビデオはバックグラウンドで再生され続けます。私が推測する一般的な問題:)
いずれにせよ、動作しているように見えるコードをいくつか見つけましたが、どうやら何か間違ったことをしたようです。これはコードです:
// stop video playback when div is hidden
$('.contextual-help-tabs li').click(function() {
var test = $('.contextual-help-tabs-wrap div.active').attr('id'); // gets previously active div ID
var clone = $('#'+test).clone(true); // clones the previously active div
$('#'+test).remove(); // removes the previously active div
$('#'+test+'-holder').html(clone); // puts it back like new
});
問題はこれです: test
実際、正しい div を返します。現在のアクティブなタブより前に開いていたタブの div ID を取得します。それは御馳走になります。また、divを削除しています。
ただし、元に戻すわけではありません。何が起こっているのかを確認するために「アラート」を表示すると、divが削除されますが、元に戻されることはありません(「未定義」として返されます)。clone
そのため、単にクローンを作成していないのか、それとも機能していないのかはわかりません$('#'+test+'-holder').html(clone);
。
補足として、私はこの代替手段も試しました:
// stop video playback when div is hidden
$('.contextual-help-tabs li').click(function() {
var test = $('.contextual-help-tabs-wrap div.active').attr('id'); // gets previously active div ID
var clone = $('#'+test).clone(true); // clones the previously active div
$('#'+test).replaceWith(clone); // replaces the previously active div with the "refreshed" contents of the div
});
それは実際にはうまく機能していました-コンテンツをコンテンツに置き換えていました(ビデオの再生が停止しました)しかし-video
コンテンツにタグがある場合(つまり、HTML5ビデオの再生)、何らかの理由でビデオが失われます。返された HTML は正確ですが、理解できない理由により、ビデオが認識されなくなり、何も再生されません。ビデオがまったく存在しないか、間違ったパスであるかのように動作します。(これはDOMがそれを認識しなくなったことと関係があると思いますか?)
いずれかのバージョンのコードを修正する方法を知っている人はいますか? ここで何が起こっているのか見えないからです。
本当にありがとう!
ETA: 余談ですが、replaceWith() 関数を使用していて、HTML5 ビデオを含むタブに移動して再生し、タブを入れ替えると、ビデオが含まれるタブに戻ると、ビデオがまだそこにあり、正常に動作し、「再生」をクリックすると、タブを交換したポイントから再生されます (最初からやり直すのではなく)。
ビデオを含むタブに移動し、HTML5 ビデオを再生する前に別のタブに移動すると、HTML5 ビデオを含むタブに戻ると、ビデオが消えます。本当に変です。
それが役立つ場合、これはこれまでのところ Google Chrome でのみ発生します。他のブラウザで問題が発生するかどうかはまだ実際に確認していません。