Question

当我点击表示＆＃34;摇滚房子的链接时，这是显示Spotify Play按钮的jQuery代码！＆＃34;

$(function() {
$('#partystart').toggle(function () {
    $(".fadeIn").addClass("party");
    $("#musicbox").slideDown("300");
    $("#partystart").html("<a id='partystart'>Take a break</a>");
}, function () {
    $(".fadeIn").removeClass("party");
    $(".fadeIn").addClass("fullopacity");
    $("#musicbox").slideUp("300");
    $("#partystart").html("<a id='partystart'>&#9650; Rock the house!</a>");
});
});

这是HTML：

<div id="partybox" >
    <iframe id="musicbox" style="margin-top: -2px; display: none;" src="https://embed.spotify.com/?uri=spotify:track:3QMLpta0AmeJLpWNmeyC6B#0:12" width="250" height="80" frameborder="0" allowtransparency="true"></iframe>
    <a id="partystart">&#9650; Rock the house!</a>
</div>

以下示例允许您点击圆圈来播放曲目而不是实际Spotify播放按钮内的播放按钮：http://spotifymusic.tumblr.com/

另外，我将#0:12放在歌曲URI的末尾，让它在0:12秒开始播放，但它似乎不起作用。我在那里做错了什么？

谢谢！

Answer 1

我没有Spotify帐户而且不打算制作一个帐户，但以下解决方案应该有效，您只需要做一些调查。

Spotify iFrame有一个附加到.play-pause-btn的点击事件（我认为）。您需要激活单击事件才能开始播放。它会是这样的：

$("#musicbox").contents().find("div.play-pause-btn").click();

将其与其余代码一起添加：

$('#partystart').toggle(function () {
    $(".fadeIn").addClass("party");
    $("#musicbox").slideDown("300");
    $("#partystart").html("<a id='partystart'>Take a break</a>");
    $("#musicbox").contents().find("div.play-pause-btn").click();
}, function () {
    $(".fadeIn").removeClass("party");
    $(".fadeIn").addClass("fullopacity");
    $("#musicbox").slideUp("300");
    $("#partystart").html("<a id='partystart'>&#9650; Rock the house!</a>");
});
});

如果它不起作用，您需要确定哪个项目上有点击事件。

当我点击触发它显示的链接时，如何触发Spotify播放按钮？

1 个答案: