Javascript 在后台运行来自google chrome扩展的音乐

Javascript 在后台运行来自google chrome扩展的音乐,javascript,html,google-chrome-extension,Javascript,Html,Google Chrome Extension,我正在制作一个google chrome扩展,你按下某些按钮,它就会启动、暂停或重新启动一首歌。我让它工作,但有一个问题。当我关闭分机时,歌曲停止了!我想知道是否有办法解决这个问题。我已经研究了背景脚本和其他东西,但我无法让它们发挥作用。请帮助我,因为这是我的第一个谷歌浏览器扩展之一,我想了解更多。谢谢你给我的任何帮助 Html:(popup.Html) CSS:(styles.CSS) 清单:(Manifest.json) popup.html创建的文档只有在打开时才存在 弹出窗口关闭时,工作

我正在制作一个google chrome扩展,你按下某些按钮,它就会启动、暂停或重新启动一首歌。我让它工作,但有一个问题。当我关闭分机时,歌曲停止了!我想知道是否有办法解决这个问题。我已经研究了背景脚本和其他东西,但我无法让它们发挥作用。请帮助我,因为这是我的第一个谷歌浏览器扩展之一,我想了解更多。谢谢你给我的任何帮助

Html:(popup.Html)

CSS:(styles.CSS)

清单:(Manifest.json)


popup.html
创建的文档只有在打开时才存在


弹出窗口关闭时,
工作并使用弹出窗口中的
chrome.runtime.sendMessage
控制背景。

将音频播放/暂停放在背景脚本/页面中,而不是弹出窗口中。jsI已尝试。由于某种原因,背景脚本无法访问popup.html,因此无法播放音频。请安装“Noisly”chrome扩展并对其进行研究。@优雅的用户,我找不到该扩展。这是我的错,我拼错了名称请查看:谢谢!我之前忘了把这个标记为答案。
<html>
<head>

<link rel="stylesheet" href="styles.css">
<script src="popup.js"></script>


</head>
<body>

<center>
<h1>Music Player</h1>
<h3>Songs:</h3>

<div id="ludicrous_speed">Ludicrous Speed 
<audio id="ludicrous" src="songs/ludicrous_speed.mp3" preload="auto"></audio>
<button class="Start" id="StartLudicrous">Start</button>
<button class="Pause" id="PauseLudicrous">Pause</button> 
<button class="Restart" id="RestartLudicrous">Restart</button>
</div>

</center>

</body>
</html>
function Start(song) {
song.play();
}

function Pause(song) {
song.pause();
}

function Restart(song) {
song.currentTime = 0;
}

document.addEventListener('DOMContentLoaded', function(){
var Start_Ludicrous = document.getElementById('StartLudicrous');
var Pause_Ludicrous = document.getElementById('PauseLudicrous');
var Restart_Ludicrous = document.getElementById('RestartLudicrous');

Start_Ludicrous.addEventListener('click', function() {
    Start(ludicrous);
});
Pause_Ludicrous.addEventListener('click', function() {
    Pause(ludicrous);
});
Restart_Ludicrous.addEventListener('click', function() {
    Restart(ludicrous);
});
});
body {

width:300px;

}

.Start {
background-color: #42f46e;
border-color: #42f46e;
border-radius: 30%;
}

.Pause {
background-color: #f4e349;
border-color: #f4e349;
border-radius: 30%;
}

.Restart {
background-color: #e03838;
border-color: #e03838;
border-radius: 30%;
}
{
"manifest_version":2,

"name":"Music Player",
"description":"Play Music",
"version":"1.0",

"browser_action":{
    "default_popup":"popup.html"
},

"permissions":[
    "activeTab"
]
}
// background.js
var audio_element = document.createElement("audio");
audio_element.src = "songs/ludicrous_speed.mp3";

audio_element.play();