1

編集:明確にするために、私が問題を抱えているのはjsfiddleではありません。それはすべてのブラウザーでうまく機能します。以下の正確なコードを使用するのは、私の Web サイトでの実際の実装です。

ページに動的に生成された 8 つの YouTube サムネイルのブロックと、プレーヤー div があります。サムネイルの 1 つをクリックすると、関連するビデオがプレーヤー div で ajaxly に再生されるようにします。次のコードは FF では機能しますが、IE や Chrome では機能しません。

$(document).ready(function(){


    $('.vidlink').click(function (event) {
            event.preventDefault();
            var addressValue = $(this).attr("href");
            alert(addressValue);

            iFrame = "<iframe width=\"560\" height=\"315\" src=\"http://www.youtube.com/embed/"+addressValue+"\" frameborder=\"0\" allowfullscreen></iframe>";


            newDiv = "<div id=\"vidPlayer\">" + iFrame + "</div>";


            $('#vidPlayer').replaceWith(newDiv);

        });

}); 

これは、私がやろうとしていることのほとんどです (JSFiddle)。

前後の二重引用符を一重引用符に変更するまで、FF でも機能しませんでした$('.vidlink')。で試してみました$(this).attr("href")が、FFで再び壊れました。

4

3 に答える 3

3
  • コードはよさそうだ
  • コンソールはエラーを吐き出さない
  • JSFiddleで動作します
  • 引用は違いを生むようです(まったく不可能です。これは私に叫びます:「あなたは間違った場所を見ている!」)

確認事項:

  • 一歩下がって周囲のコードを確認するのが得策かもしれません
  • イベントのバインドを解除する可能性のあるコードがないことを確認してください。ある場合は、その周りにいくつかdebuggerの s/breakpoints/を設定しますconsole.log
  • イベント関数内にいくつかdebuggerの s/breakpoints/を設定しますconsole.log
  • ファイルがキャッシュされていないことを確認してください。JavaScript が外部ファイルにある場合、別の方法として、そのファイルに直接移動して、そこでキャッシュを更新します。
  • サイトの正しいバージョンを表示していることを確認します (例: ローカル バージョンを編集せずに外部バージョンを表示する)
  • 何が起こっていると思うかについてのすべての仮定を見直してください

あなたが投稿したコードに問題がないことは 99% 確信しています。あなたが持っているのはそれらのエラーの1つであると思います.それが最終的に機能するとき、あなたは永遠にあなたの顔をなでて、夜に眠れなくなるでしょう. みんなでやります!

于 2013-05-09T01:28:58.960 に答える
1

FF と Chrome と IE で動作しています。単一引用符または二重引用符は違いを生むべきではありません。あなたがそう思うという事実は、あなたが適切にテストしていないと私に思わせます。各ブラウザでキャッシュをクリアしてください。または、正常に動作しているかどうかを判断する前に、少なくとも [更新] を数回押してください。

于 2013-05-09T01:23:19.953 に答える
0

Youtube API を使用しようとすると、非常に簡単に 1 つのビデオを含めることができるため、エラーを回避できます。

簡単な例は、https://developers.google.com/youtube/iframe_api_reference#Getting_Startedにあります。

于 2013-05-09T02:25:18.930 に答える