Tag: youtube api

在一个页面上嵌入多个YouTube播放列表供稿？ JQuery / YouTube API v3: 如何在一个页面上实施多个YouTubevideo播放列表供稿？到目前为止，我已经开发了一个函数来从单个播放列表中提供最近的上传，但我不确定如何将其应用于多个播放列表。在提供的代码段中，我只有一个播放列表返回video列表数据。用于嵌入播放列表的HTML字符串是#youtube-playlist-feed_1 ，但理想情况下我希望能够实现多个Feed，例如： #youtube-playlist-feed_2 ， #youtube-playlist-feed_3等…任何输入？ var htmlString = “”; var apiKey = ‘AIzaSyDI4rWo_wVAxRZEIgF6_8sRZDj8OCOZZ38’; var playlistID = ‘PLBhKKjnUR0XBVrHvtDOylN5XREHh9X1nt’; var maxResults = 7; $.getJSON(‘https://www.googleapis.com/youtube/v3/playlistItems?key=’ + apiKey + ‘&playlistId=’ + playlistID + ‘&part=snippet&maxResults=’ + (maxResults > 50 ? 50 : maxResults), function(data) { $.each(data.items, function(i, item) { var videoID = item[‘snippet’][‘resourceId’][‘videoId’]; var title = item[‘snippet’][‘title’]; […]

获取返回随机值的函数的当前值: 我想要做的是获取当前正在播放的YouTubevideo的当前videoID，并将其显示在div中。这是我的YT iframe API代码（就像谷歌开发网站上的基本示例一样）： var player; function onYouTubeIframeAPIReady() { player = new YT.Player(‘player’, { height: ‘390’, width: ‘640’, videoId: currentVideoId, events: { ‘onReady’: onPlayerReady, ‘onStateChange’: onPlayerStateChange, ‘onError’: onError, }, }); } 正如您所看到的，VideoId（它将播放的第一个video）由一个名为“currentVideoId”的变量设置，该变量之前设置如下： var currentVideoId = ‘9z4Kft47kBM’ 我想在div中显示当前ID 为此，我使用了以下代码： $(‘#currentVideoDiv’).html(‘Currently Playing:’ + currentVideoId); 到目前为止一切顺利，它正确地显示了我的第一个videoID。现在，在第一个video结束后，onStateChange事件将调用此函数： function onPlayerStateChange(event) { if(event.data === 0) { swapVideo(); } } “swapVideo”函数将调用函数getId（）; […]

在同一页面上播放和暂停多个YouTubevideo的按钮: 我需要在网页上嵌入YouTubevideo，我想使用youtube播放器API通过自定义控件按钮（播放/暂停/进度条）控制我的video。我使用了一个教程（ https://css-tricks.com/play-button-youtube-and-vimeo-api/ ）并添加了一些自定义，它工作正常： https://jsfiddle.net/tpo6sgzf/ /* VIDEO */ var player, time_update_interval = 0; function onYouTubeIframeAPIReady() { player = new YT.Player(‘video’, { events: { onReady: initialize } }); } function initialize(){ // Update the controls on load updateTimerDisplay(); updateProgressBar(); // Clear any old interval. clearInterval(time_update_interval); // Start interval to update elapsed time display and // the […]

添加事件处理程序以循环动态创建的播放列表（YouTube API）: 尝试实现播放列表function以及收听历史记录。用户动态地拖放/排序播放列表的video缩略图到div中。每次单击缩略图时，video都会加载到播放器中，video会添加到历史记录中（ subHist.click() ）。因为video是动态创建的，所以我无法创建事件监听器以在开始时转到下一个video，并且必须在以后添加它。问题是我在创建事件监听器的函数中有监听历史记录function，因此当我们浏览播放列表时，事件监听器被调用的次数增加，这意味着当单击一次时，video会在播放列表中多次出现。对于某些代码，这可能更有意义： $(‘#Playlist’).on(‘click’, ‘.playlistYT’, function(){ $(‘#subHistory’).click(); videoID = $(this).attr(“src”).slice(27,38); $(‘#infoID’).val(videoID); player.loadVideoById(videoID ); var nextVideo = $(this).parent().next().find(‘.playlistYT’); player.addEventListener(‘onStateChange’, function stopCycle(event) { if (event.data == YT.PlayerState.ENDED) { $(nextVideo).click(); } }); }); 图像属于类.playlistYT一旦被删除（即在删除任何video之前该类不存在），以及$(‘#subHistory’).click()将video添加到收听历史记录中。如果我在addEventListener移动var nextVideo ，那么它就无法识别它（不能使用$(this)因为它似乎将其重新定义为事件处理程序中的事件）。将$(‘#subHistory’).click()到stopCycle函数似乎没什么区别。花了几天时间玩.one，.off，.live，似乎无法破解它。 removeEventListener似乎没有任何区别。我想过将一个隐藏的video添加到播放列表中，但这会成为确保video不会出现在用户的收听历史记录/播放列表中的问题。

部分内容的相关video详细信息和统计数据 – Youtube API V3: 我在将相关video检索为特定video的缩略图时遇到问题。在我的代码中，我正确设置了search->list ，并返回相关video的不同标题和缩略图URL。但是，由于search->list没有参数contentDetails或statistics ，我在这里找到了与我完全相同的问题相关的另一个问题并使用了二次调用来获取videos->list因为它支持这些参数以便能够检索持续时间并查看计数。但问题是两个值（ vidDuration和viewCount ）都没有传递任何东西，并且标记为未定义，因为项目通过它并停止。如何根据search->list的项目生成项目的duration和viewCount值？的script.js： function relatedVids(videoId) { debugger; $.get( // get related videos related to videoId – relatedToVideoId “https://www.googleapis.com/youtube/v3/search”, { part: ‘snippet’, maxResults: vidResults, relatedToVideoId: videoId, // $.cookie(“id”); from https://stackoverflow.com/questions/36314874/related-videos-with-part-contentdetails-and-statistics-youtube-api-v3/single-video.html type: ‘video’, key: ‘XXXXXXXXX’ }, function(data) { $.each(data.items, function(i, item) { console.log(item); var vidTitle = item.snippet.title; // video title […]

Javascript事件监听器从监听中退出（？）… Youtube API – 没有控制台错误: 编辑 – 2016-06-25 （我删除了我的6月16日更新，因为不再相关。我把OP留在了……）我今天又花了4个小时。现在情况如下：我的函数适用于两个链接。 video参数在数组中定义。另外两个链接不起作用。我得到一个Uncaught TypeError: thisPlayer.loadVideoById is not a function链接＃3和＃4 Uncaught TypeError: thisPlayer.loadVideoById is not a function 。但是相同function对链路＃1和＃2有效。似乎youtube对象仅为两个第一个定义。为什么？请仔细查看此实时链接上的控制台： https://www.bessetteweb.com/?p=youtube-video-test 我插入了很多console.log消息来说清楚。这是我的实际代码： // Global variable for the player var player = []; var statePlaying=false; playerArr = [{ linkID:”link0″, divID:”player1″, ytID:”5V_wKuw2mvI”, // Heavy metal playlist start:20, […]

自动播放youtube和soundcloud相互嵌入: 我有一个音乐博客，其中包含一系列youtube和soundcloud嵌入。我想一个接一个地自动播放页面上的所有嵌入内容。换句话说，在youtube嵌入我播放结束之后，我希望下一个嵌入式开始播放，无论是来自soundcloud还是youtube，反之亦然。呈现的HTML如下所示：我从这个来源获得了帮助：在播放Soundcloud时暂停Youtube嵌入要跟踪页面上的哪些玩家，他们属于哪个api，以及他们当前正在玩哪个玩家： var playerCurrentlyPlaying = {“api”:null,”frameID”:null}; var players = {“yt”:{},”sc”:{}}; 我需要定义一个通用的playNext函数，该函数在playerCurrentlyPlaying结束时调用。根据下一个嵌入的api，playNext函数必须执行正确的播放命令。为了找到下一个嵌入，该函数可能会将当前播放iframe的ID增加1.这样如果id =“ui-id-2”刚刚结束，那么id =“ui-id-3”应该播放。有时这些YouTubevideo会崩溃，并说“video不再存在”或“上传者已在您所在的国家/地区无法使用”。在这些情况下，我如何检查崩溃并跳到下一个递增的ID（例如id =“ui-id-4”）？此video已不存在：

如何在javascript中使用API捕获Youtube播放器的拖动/跳过/转发事件: 我正在查看onStateChange的文档，但即使用户将向左或向右拖动播放器计时器，我也找不到任何内容。事实上，当我这样做时，onStateChange并没有抓到任何东西。这来自文档： https://developers.google.com/youtube/iframe_api_reference 只要玩家的状态发生变化，此事件就会触发。 API传递给事件侦听器函数的事件对象的data属性将指定与新播放器状态对应的整数。可能的值是： -1 (unstarted) 0 (ended) 1 (playing) 2 (paused) 3 (buffering)f 5 (video cued). 当玩家首次加载video时，它将广播未启动的（-1）事件。当video被提示并准备播放时，播放器将播放video提示（5）事件。在您的代码中，您可以指定整数值，也可以使用以下命名空间变量之一： YT.PlayerState.ENDED YT.PlayerState.PLAYING YT.PlayerState.PAUSED YT.PlayerState.BUFFERING YT.PlayerState.CUED 但是当你尝试分享video时，Youtube以某种方式做到了！转到YouTubevideo，然后单击共享按钮，然后在尝试拖动播放器的计时器时查看“开始时”文本字段。使用播放器的getCurrentTime更新文本字段。 Youtube是怎么做到的？

动态更改youtube上的videoID: 我正在尝试使用以下代码显示没有video的youtube音频，因此我正在更改videoID，但它一次又一次地播放相同的ID。 About function val1(val) { document.getElementsByTagName(“div”)[0].setAttribute(“data-video”, val); alert(val); } Hello change

当youtubevideo完成时关闭fancybox弹出窗口: 我在页面加载时用youtubevideo弹出了一个弹出窗口。当video完成时，我需要关闭弹出窗口…是否可以集成此脚本？这是代码： $(document).ready(function() { $(“#yt”).click(function() { $.fancybox({ ‘padding’ : 0, ‘autoScale’ : false, ‘transitionIn’ : ‘none’, ‘transitionOut’ : ‘none’, ‘title’ : this.title, ‘width’ : 880, ‘height’ : 595, ‘href’ : this.href.replace(new RegExp(“watch\\?v=”, “i”), ‘v/’), ‘type’ : ‘swf’, ‘swf’ : { ‘wmode’ : ‘transparent’, ‘allowfullscreen’ : ‘true’ } }); return false; }); }); $(‘#foo’).bind(‘click’, function() […]