0

I am using the SoundCloud custom player (https://github.com/soundcloud/soundcloud-custom-player) and have a site where this needs to be in a seperate frame so the audio keeps playing when the main site is being navigated. I need to pass the track url to the player in the top frame from within the main frame. I have tried the below code with no luck. The top frame has the name and id of 'play'. Can anyone advise how I can do this please? Many thanks.

<a class="sc-remote-play" href="#">Play Me</a>
<script type="text/javascript">
$(function() {
 $('a.sc-remote-play').live('click', function(event) {
  $('top.frames["play"].sc-player').scPlayer({
  links: [{url: "http://SOUNDCLOUD_PATH_HERE"}],
  autoPlay: true
  });
 });
});
</script>
4

1 回答 1

0

您可以使用parent.frames获取其他框架。本页描述了如何使用框架。

您可以使用parent.frames[0]到达第一帧的窗口。要使用 jQuery 在那里找到一个元素，您需要给它一个上下文，例如：

$('.sc-player', parent.frames[0].document)

但是，这意味着您将有两段代码播放彼此不了解的音乐。我认为您最好创建一个可以播放的函数，并允许其他框架使用它。播放器代码将是这样的：

play = function(url) {
  $('.sc-player').scPlayer({
    links: [{url: url}], autoPlay: true
  });
};
$(function() {
 $(document).on('click','a.sc-playme1', function(event) {
  play("http://soundcloud.com/axwell/cotu-dyrormx-dannyhoward");
 });
 $(document).on('click','a.sc-playme2', function(event) {
  play("http://soundcloud.com/vatogonzalez/earthquakeremix");
 });
});

然后站点代码将通过以下方式调用它parent.frames[0]：

$(document).on('click','a.sc-playme4', function(event) {
  parent.frames[0].play("http://soundcloud.com/vatogonzalez/earthquakeremix");
});

这是一个显示它在行动中的 plunker：http ://plnkr.co/edit/AvlipjpPvE7x15CstAiU?p=preview Play Me 4 是有效的。玩我 3 无法正常工作。点击 Play Me 3 和任何其他链接以查看它们是否同时播放。

于 2013-07-05T00:57:35.400 回答