0

我的动态 YouTube 加载代码一直有效,但不再有效。这是相关的jQuery:

$("#btnSubmit").click(function (e) {
    var searchTerm = "";
    if ($("#inputText").val() !== "") {
        searchTerm = $("#inputText").val();
    } else {
        searchTerm = "jquery";
    }

    var urlYouTube = "http://gdata.youtube.com/feeds/api/videos?vq='" + searchTerm + "'&max-results=7&orderby=published&alt=json";

    $.getJSON(urlYouTube, function (data) {
        // Loop through each feed entry
        alert("made it into ewe toob");
        $.each(data.feed.entry, function (i, item) {
            // Get the URL for the video
            var url = item.link[0].href;
            // Get the title of the video
            var title = item.title.$t;
            // Get the first 10 characters of date video was published or: YYYY-MM-DD
            var datepublished = item.published.$t.substring(0, 10);
            // Get the author name
            var author = item.author[0].name.$t;
            // Get the thumbnail image for the video
            var thumbnailURL = item.media$group.media$thumbnail[0].url;
            // Construct the display for the video
            var text =
                "<br><a href='" + url + "'>" + title + "</a><br>" +
                    "Published: " + datepublished + " by " + author + "<br><br>" +
                    "<img src='" + thumbnailURL + "'><br>";
            // Append the text string to the div for display
            $("#duckbilledPlatypusTab-YouTube").append(text);
        });
    });
});

这不再用视频填充我的“You Tube”标签。事实上,我从来没有看到,“把它做成母羊toob”。

我一直试图在 iframe 中显示结果,但由于不再显示结果,我进入调试模式,将 F12 捣碎,然后看到:

Refused to display 'http://gdata.youtube.com/feeds/api/videos?vq=platypus&max-results=7&orderby=published&alt=json' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'. about:blank:1

所以我从这个改变了html:

<div id="duckbilledPlatypusTab-YouTube" style="min-height: 50vh">
    <iframe style="min-height: 100%;min-width: 100%" src="@urlYouTube"></iframe>
</div>

...简单地说:

<div id="duckbilledPlatypusTab-YouTube" style="min-height: 50vh">
    @urlYouTube
</div>

...我在该选项卡中得到的只是:“ http://gdata.youtube.com/feeds/api/videos?vq=platypus&max-results=7&orderby=published&alt=json

IOW,我不再收到控制台错误消息,但我仍然没有收到视频。我也试过“@Html.Raw(urlYouTube)”有人知道为什么会失败以及如何解决这个问题吗?

更新

它仍然无法正常工作(警报甚至不会弹出和唠叨),即使代码现在是这样的:

HTML

<div id="duckbilledPlatypusTab-YouTube" style="min-height: 50vh">
</div>

jQuery

$.support.cors = true;
$(document).ready(function () {
    $("#duckbilledPlatypusTabs").tabs();

    //This doesn't seem to do anything...
    $.ajaxSetup({ cache: false });

    $("#btnSubmit").click(function (e) {
        var searchTerm = "";
        if ($("#inputText").val() !== "") {
            searchTerm = $("#inputText").val();
        } else {
            searchTerm = "jquery";
        }

. . .

var urlYouTube = "http://googleapis.com/youtube/v3/search?part=snippet&q='" + searchTerm + "'";
. . .            
});
        });
4

0 回答 0