Работа с YouTube Google API и jQuery - PullRequest
2 голосов
/ 03 ноября 2010

Я перебираю каждый li, сгенерированный базой данных, которая выдает ссылку на YouTube на видео, на которое я хочу дать ссылку. По сути, у меня есть это:

<ul id="mediaList">
    <li>
        <p>http://www.youtube.com/watch?v=TOm-myVLmKU</p>
    </li>
    <li>
        <p>http://www.youtube.com/watch?v=odNde8wQ5uA</p>
    </li>
</ul>

Мне нужно пройтись по каждому элементу li, захватить ссылку на YouTube, захватить идентификатор видео, а затем получить данные JSON и конечную цель - добавить тег изображения для этого видео в элемент списка для списка СМИ

Для этого у меня есть этот код jquery (обратите внимание, что при отсутствии конфликта, $ становится $ j):

$j(document).ready(function () {

$j("#mediaList li").each(function (){

    var u = $j(this).find("p").text();
    var reqStart = "http://gdata.youtube.com/feeds/api/videos/";
    var reqSettings = "?v=2&alt=json-in-script&callback=?";
    var vid = grabytvid(u);

    var request = reqStart + vid + reqSettings;

    $j.getJSON(request, function(data) {
        var y = (data.entry["media$group"]["media$thumbnail"][0].url);

    });

    $j(this).append('<img src="' + y + '" alt="" />');

    });
});

Где я использую вызов YouTube API Feed:

http://gdata.youtube.com/feeds/api/videos/[Video_ID_Here]?v=2

Для справки grabytvid - это функция, которая просто разбивает и захватывает идентификатор видео:

function grabytvid(ystring)
{
    var v = ystring.split("=").pop();
    return v;
}

Есть какие-нибудь идеи, где я ошибаюсь?

Ответы [ 2 ]

2 голосов
/ 03 ноября 2010

Все просто. Вы y не определены в $j(this).append('<img src="' + y + '" alt="" />');, поскольку вы устанавливаете y только внутри функции getJSON

Я бы сделал это так

$("#mediaList li").each(function() {

    var self = this, u = $(this).find("p").text();
    var reqStart = "http://gdata.youtube.com/feeds/api/videos/";
    var reqSettings = "?v=2&alt=json-in-script&callback=?";
    var vid = grabytvid(u);

    var request = reqStart + vid + reqSettings;

    $.getJSON(request, function(data) {
        var y = (data.entry["media$group"]["media$thumbnail"][0].url);
        $(self).append('<img src="' + y + '" alt="" />');
    });
});
1 голос
/ 03 ноября 2010

Обратите внимание, что y не входит в область действия при его вызове:

$j(this).append('<img src="' + y + '" alt="" />');

Я рекомендую внести следующие изменения:

var y;

$.getJSON(request, function(data) {
   y = (data.entry["media$group"]["media$thumbnail"][0].url);

});

Надеюсь, это поможет, Наслаждайся жизнью.

...