添加事件处理程序以循环动态创建的播放列表（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不会出现在用户的收听历史记录/播放列表中的问题。
传递给事件侦听器的onStateChange事件具有“data”对象，但它还具有表示引发事件的播放器的“target”对象。 因此，例如，您可以在初始化iFrame API时定义处理onStateChange的函数，并且在该侦听器函数中，您可以使用以下内容：
event.target.getVideoData().video_id
查找引发事件的播放video的ID。 根据您的示例代码，看起来知道videoID可能会帮助您编写正确的jQuery选择器以查找DOM中video的位置，然后从那里导航到下一个。 因此，您的事件监听器只会被定义一次，但它将能够处理应用程序播放列表的动态特性。