0

ここ のこのページを見ると、YouTube ビデオ ギャラリーを少し作成したことがわかります。動作すると、ページのメイン セクション (上部) のビデオがクリックされたサムネイルに置き換えられ、右側のテキストもそのビデオに関連するテキストに置き換えられます。

テキストの置換は完全に機能しているようですが、スワップ中に iFrame が複数回配置されているように見えるため、ビデオが 2 ～ 3 回再生されるという問題が発生しています。

Javascript は以下のとおりです。これは私が見逃したものですか?

<script>
function replaceVideo(id) {
  originalSrc = jQuery("iframe", "#" + id).attr("src");
  autoPlay = originalSrc + "&autoplay=1";
  jQuery("iframe", "#" + id).attr("src", autoPlay);
  video = jQuery(".video-wrap", "#" + id).html();
  jQuery(".flex-video").html(video);
  text = jQuery(".video-description", "#" + id).html();
  jQuery(".vid_desc").html(text);
  jQuery("iframe", "#" + id).attr("src", originalSrc);
}

jQuery(".video-list li").click(function() {
  id = jQuery(this).attr("id");
  replaceVideo(id);
});

    jQuery(window).load(function() {
  if(window.location.search.substring(1)) {
        element = window.location.search.substring(1).split('&');
        if (document.getElementById(element[0])) {
            document.onload = replaceVideo(element[0]);
        }
    }
});
</script>

ありがとう！

4

1 に答える 1

0

jQuery(".flex-video")これを JavaScript コンソールで実行します。そのクラスを持つ 3 つの div があることがわかります。したがってjQuery(".flex-video").html(video);、JS のこの行は、3 つの要素の内部 HTML を iframe に変更します。

<div class="flex-video widescreen">
  <iframe width="583" height="328" src="http://www.youtube.com/embed/TWmFCX40BQc?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>
</div>

flex-video上記の div を他のフレームと区別できるようにする必要があります。親 div に id または別のクラス、またはクエリを実行する何かを指定します。そうすれば、あなたは大丈夫です。

編集: ところで、このコードは間違っています:

if(window.location.search.substring(1))
{
    element = window.location.search.substring(1).split('&');
    if (document.getElementById(element[0])) {
        document.onload = replaceVideo(element[0]);
    }
}

document.onload を関数呼び出しに設定すると、replaceVideo が呼び出され、onloadプロパティが返されたものに設定されますが、これは何もありません。ビデオが再生されるので動作しているように見えるかもしれませんが、それは単にreplaceVideoメソッドを呼び出しているからです。if をこれに設定すれば、おそらく十分でしょう (なぜ に設定するのか説明できない場合onload)

if(document.getElementById(element[0]))
     replaceVideo(element[0]);
于 2013-03-15T15:05:08.563 に答える