如何修复下一个复选框函数

在下面的代码中，我要确保如果检查了复选框，则变量mp3将包含mp3文件的URL，如果未检查复选框，则将赢得''t。

我的代码看起来像：

function audio(){
var checkBox = document.getElementById("audio");
if(checkBox.checked == true){
var mp3 = ('https://ia800503.us.archive.org/8/items/futuresoundfx-98/futuresoundfx-13.mp3');
var audio = new Audio('#mp3');
audio.play();
}else{
var mp3 = ('');
var audio = new Audio('#mp3');
audio.play();
}
}

<html>
<body>
<input type="checkbox" id="audio" onclick="audio()">
</body>
</html>

问题是audio变量未从mp3获取URL。

我该如何正确执行？

我不确定您的问题。所以请看到并告诉我我的错误。

function audio() {
var checkBox = document.getElementById("audio");
var audio = document.createElement("audio");
audio.src = 'https://ia800503.us.archive.org/8/items/futuresoundfx-98/futuresoundfx-13.mp3';
if (checkBox.checked) {
audio.play();
} else {
audio.pause();
audio.currentTime = 0;
}
}

<html>
<body>
<input type="checkbox" id="audio" onchange="audio()">
</body>
</html>

function audio() {
var checkBox = document.getElementById("audio");
if (checkBox.checked) {
console.log("Audio will be played");
}
else 
{
console.log("Audio won't be played");
}
}

<html>
<body>
<input type="checkbox" id="audio" onchange="audio()">
</body>
</html>

如果您都想尝试一下。

function audio() {
var checkBox = document.getElementById("audio");
var audio = document.createElement("audio");
audio.src = 'https://ia800503.us.archive.org/8/items/futuresoundfx-98/futuresoundfx-13.mp3';
if (checkBox.checked) {
audio.play();
console.log("Audio will be played.");
} else {
audio.pause();
audio.currentTime = 0;
console.log("Audio won't be played.");
}
}

<html>
<body>
<input type="checkbox" id="audio" onchange="audio()">
</body>
</html>

而不是onlick=audio()尝试onchange=audio()。

您可能还想将元素添加为参数，而不是像这样通过ID获取它：

function audio(checkBox){
  if(checkBox.checked == true){
    var mp3 = ('https://ia800503.us.archive.org/8/items/futuresoundfx-98/futuresoundfx-13.mp3');
    var audio = new Audio('#mp3');
    audio.play();
    console.log("Audio will be played.");
  }else{
    var mp3 = ('');
    var audio = new Audio('#mp3');
    audio.play();
    console.log("Audio will be NOT be played.");
  }
}

<html>
<body>
    <input type="checkbox" id="audio" onchange="audio(this)">
</body>
</html>

相关内容

最新更新

热门标签：