自动播放下一个 soundcloud

Question

我目前正在制作我的音乐博客，我正在尝试让小部件在前一个完成时启动。我有 soundcloud 和 youtube 小部件，但优先级是为 soundcloud 实现此功能。

每个 iframe 都有 2 个类 .widget &.soundcloud_widget for soundcloud 和 .widget & .youtube_widget for youtube。最后，每个小部件都会按照出现的顺序获得一个 id “widget1”、“widget2”等。

我们的想法是获取事件“SC.Widget.Events.FINISH”，获取相应小部件的ID，“增加”它，然后播放下一个。

不幸的是，我正在为 javascript 和 soundcloud 的文档而苦苦挣扎，我非常感谢一些帮助！

提前致谢

PS : 这是执行上述操作的代码，我没有其他可用的...

    <script type="text/javascript">
    function autoPlayInitiate () {
        var i=1; 
        $("iframe[src^='https://w.soundcloud.com/']").addClass("widget soundcloud_widget"); 
        $("iframe[src^='//www.youtube.com']").addClass("widget youtube_widget");
        $('.widget').each(function(){
          $(this).attr('id','widget'+i);
          i++;
        }); 
    }
    window.onload = autoPlayInitiate;

     $(document).ready(function () { 
       var ScWidget = $('.soundcloud_widget');
     }
</script>

Answer 1

首先，我认为您解决此问题的最简单方法是选择一个播放器（youtube 或 soundcloud）并使用播放列表功能来展示您的声音。 这是一个在 Sound Cloud 中使用播放列表的实时示例，您可以使用它来播放
http://runnable.com/UuhEs3Yq2_8hAACT/embbed-soundcloud-widget-using-javascript
相关代码：

function embed (id) {
  SC.oEmbed("http://soundcloud.com/" + id // user or playlist to embed
    , { color: "ff0066"
      , auto_play: true
      , maxwidth: 500
      , maxheight: 1000
      , show_comments: true } // options
    , document.getElementById("scWidget") // what element to attach player to
  );
}

$(document).ready(
  function () {
    embed("dj-faze");
  }
);

但是，如果您想走更远的路，您需要熟悉小部件 API：
http://developers.soundcloud.com/docs/api/html5-widget#
bind(eventName, listener) 是你最感兴趣的

var iframeElement   = document.querySelector('iframe');
var iframeElementID = iframeElement.id;
var widget         = SC.Widget(iframeElement);
widget.bind(SC.Widget.Events.FINISH, function () {
  alert('add code to play next song here')
});

网站完成维护后，我将尝试在可运行文件上建立一个新示例