Javascript 如何在html中为网页添加循环音乐？
我正在尝试将背景音乐添加到我的游戏中，但它不起作用我希望它继续循环，即使我移动到第二页如何修复它 以下是我迄今为止所做的尝试：Javascript 如何在html中为网页添加循环音乐？,javascript,html,css,Javascript,Html,Css,我正在尝试将背景音乐添加到我的游戏中，但它不起作用我希望它继续循环，即使我移动到第二页如何修复它 以下是我迄今为止所做的尝试： <!DOCTYPE html> <html lang="en"> <canvas id="bg"></canvas> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-
<!DOCTYPE html>
<html lang="en">
<canvas id="bg"></canvas>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
<script type="text/javascript" src="Homepage.js"></script>
<embed src="https://www.youtube.com/watch?v=-6nzGfMla-k&feature=youtu.be" autostart="true" loop="true"
width="2" height="0"></embed>
</head>
我建议您从下载youtube的视频音频，只需进入视频链接并下载音频并保存，然后在
src像这样创建音频，添加
autoplaylooptrue <audio autoplay loop="true">
<source src="yourSong.mp3" type="audio/mpeg">
</audio>
我建议您从下载youtube的视频音频，只需进入视频链接并下载音频并保存，然后在
src像这样创建音频，添加
autoplaylooptrue <audio autoplay loop="true">
<source src="yourSong.mp3" type="audio/mpeg">
</audio>
您不能使用
playerVarsautoplayloop1playlistvideoIdvar播放器；
函数onyoutubeiframeapiredy（）{
player=新的YT.player（'playerRapper'{
高度：“0”，
宽度：“0”，
videoId:'-6nzGfMla-k'，
playerVars：{
“自动播放”：1，
“控件”：0，
“自动隐藏”：1，
“enablejsapi”：1，
“循环”：1，
“disablekb”：1，
“fs”：0，
“品牌”：0，
“showinfo”：0，
“颜色”：“白色”，
“主题”：“光”，
“rel”：0，
“播放列表”：“-6nzGfMla-k”
},
活动：{
“onReady”：函数onPlayerReady（ev）{
ev.target.playVideo（）；
}
}
});
}
函数startBgMusic（）{
player.playVideo（）
文档。删除EventListener（“单击”，开始播放音乐）；
}
文档。添加的列表器（“单击”，开始播放音乐）
这在堆栈代码段预览中不起作用，请查看上面的链接代码笔
不能使用
标记嵌入YouTube视频。你可以用这个来代替。将playerVars
对象的autoplay
和loop
属性设置为1
，将playlist
属性设置为与videoId
相同的ID
但是，浏览器使用不同的策略来决定是否允许网页自动启动媒体。一定数量的用户交互必须已经发生才能允许。您可以做的是，在用户第一次交互时，通过单击页面上的某个元素来启动音乐。这可能是一个启动游戏的按钮，一个用户从中选择游戏选项的选择列表，等等。对于这个演示，我绑定到整个文档的点击事件
由于YouTube JS API似乎无法在堆栈片段中工作
注意：Chrome在codepen中运行的代码似乎也存在一些问题。但是把它放到一个文件中，然后上传到服务器上，然后在那里运行，我就能够让它始终如一地工作。第一次通过单击文档上的任意位置，然后在下一页上通过autoplay加载
var播放器；
函数onyoutubeiframeapiredy（）{
player=新的YT.player（'playerRapper'{
高度：“0”，
宽度：“0”，
videoId:'-6nzGfMla-k'，
playerVars：{
“自动播放”：1，
“控件”：0，
“自动隐藏”：1，
“enablejsapi”：1，
“循环”：1，
“disablekb”：1，
“fs”：0，
“品牌”：0，
“showinfo”：0，
“颜色”：“白色”，
“主题”：“光”，
“rel”：0，
“播放列表”：“-6nzGfMla-k”
},
活动：{
“onReady”：函数onPlayerReady（ev）{
ev.target.playVideo（）；
}
}
});
}
函数startBgMusic（）{
player.playVideo（）
文档。删除EventListener（“单击”，开始播放音乐）；
}
文档。添加的列表器（“单击”，开始播放音乐）
这在堆栈代码段预览中不起作用，请查看上面的链接代码笔即使你移动到另一个页面，让音乐继续播放也比让它播放要困难得多。堆栈溢出更适合于一次只问一个问题，所以我建议现在就尝试播放音乐。之后，你可以查看更多关于如何做其他事情（使用等）的信息，如果你无法让它工作，那么可以创建另一个问题。一些浏览器会在用户与页面交互之前阻止页面中的音频。因此，即使你得到音频播放，你也必须考虑如何使它与这个限制一起工作。你可以使用FraseSET作为90年代运行一个帧播放音乐，并把可视内容加载到另一个部分。让音乐继续播放，即使当你移动到另一个页面要比让它播放更难。堆栈溢出更适合于一次只问一个问题，所以我建议现在就尝试播放音乐。之后，您可以查看更多关于如何做其他事情的信息（使用等）