0

YouTubeビデオのURLに含まれているビデオIDを抽出し、そのIDを変数に保存して、YouTubeビデオを埋め込むためのiframeを作成するときに参照できるようにしようとしています。

以下は私のコードです：

  $(".result").live("click", function () {
       var result_number = 0;
       youtubequery = "https://gdata.youtube.com/feeds/api/videos?category=Music&q=thesongstitle&v=2&alt=json&max-results=5";
       youtubeid = "";
       $.getJSON(youtubequery, function (vid_data) {
           $.each(vid_data.feed.entry, function (e, vid) {
               if (e == result_number) {
                   youtubeid = vid.id.$t.substring(27);
               }
           });
       });
       iframehtml = "<iframe height='300' width='400' src='http://www.youtube.com/embed/" + youtubeid + "?autoplay=1' frameborder='0' allowfullscreen></iframe>";
       $("#youtube_vid").html(iframehtml);
   });

初めてYouTubeIDが変数iframehtmlに保存されているiframehtmlに含まれていないときに、クラス「result」のdivをクリックしたとき。しかし、2回目にクリックすると、すべてが期待どおりに機能します。誰かがこれを引き起こしている可能性があることを知っていますか？iframehtml変数の作成とhtmlを#youtube_vidに配置する行を含めると、それを機能させることができましたが、私のサイトの機能のため、そのようにコーディングすることはできません。

4

2 に答える 2

3

getJSON関数は非同期のhttpgetリクエストを実行しています。したがって、呼び出すと、リクエストからデータが返される前に戻ります。もう一度.resultをクリックするまでに、データが返されます。入れてみてください

iframehtml = "<iframe height='300' width='400' src='http://www.youtube.com/embed/" + youtubeid + "?autoplay=1' frameborder='0' allowfullscreen></iframe>";
$("#youtube_vid").html(iframehtml);

getJSONコールバック関数内では、htmlが表示されるまでに遅延が発生しますが、機能します。

于 2012-07-19T19:14:34.827 に答える
1

IDフィールドに入力する$.each()場所は、AJAXコールバック関数で非同期的に実行されますが、その変数をすぐに使用しようとしています。

iframeコールバック関数中にも追加する必要があります。

$(".result").live("click", function () {
    var result_number = 0;
    var youtubequery = "https://gdata.youtube.com/feeds/api/videos?category=Music&q=thesongstitle&v=2&alt=json&max-results=5";
    $.getJSON(youtubequery, function (vid_data) {
        var youtubeid;
        $.each(vid_data.feed.entry, function (e, vid) {
            if (e == result_number) {
                youtubeid = vid.id.$t.substring(27);
            }
        });
        iframehtml = "<iframe height='300' width='400' src='http://www.youtube.com/embed/" + youtubeid + "?autoplay=1' frameborder='0' allowfullscreen></iframe>";
        $("#youtube_vid").html(iframehtml);
    });
});

iframeFWIWでは、マークアップに目的のサイズを事前に作成してから、.src属性を設定してロードを開始することをお勧めします。http://jsfiddle.net/alnitak/z4rQg/を参照してください

于 2012-07-19T19:14:45.607 に答える