Question

我正在使用SoundCloud自定义播放器（https://github.com/soundcloud/soundcloud-custom-player）并且有一个网站需要在一个单独的框架中，以便在导航主网站时继续播放音频。我需要将轨道网址从主框架内传递到顶部框架中的播放器。我试过下面的代码没有运气。顶部框架的名称和ID为“play”。谁能告诉我怎么能这样做呢？非常感谢。

<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>

Answer 1

您可以使用parent.frames获取另一帧。 This Page介绍了如何使用框架。

您可以使用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");
});

这是一个让它显示出来的动画：http://plnkr.co/edit/AvlipjpPvE7x15CstAiU?p=preview Play Me 4是有效的。 Play Me 3无法正常工作。点击Play Me 3和任何其他链接，看看它们是否同时播放。

Soundcloud自定义播放器从其他框架传递信息

1 个答案: