javascript - 通过 Javascript 控制 何时播放和停止

Question

我正在尝试在 html 中制作几个音频元素，当我通过 JavaScript 告诉它们时，它们会播放音乐。

这是我的 html:

<div id="pixelbutton" onClick="musicplay1()"> </div>

<audio id="song1" src="audio/ruins.wav" autostart=false hidden=true> </audio>

还有我的 JavaScript:

function musicplay1() {
var song1 = document.getElementById("song1");
song1.setAttribute('autostart', 'true');
}

音频是有充分理由的，所以请不要再问我“天啊，真的吗!？你在网页上放声音？这真的很烦人。”评论。

问题是:如何在 JavaScript 中创建一个函数来控制 html 音频标签的播放时间？

我对 JavaScript 还很陌生，因此非常感谢您的帮助。

Answer 1

您还没有提出问题，但我可以看到一些需要改进的地方:

• autostart和hidden是 bool 属性，但这并不意味着您应该将它们视为 bool 变量。如果该属性存在，则将其视为打开，否则将其视为关闭。没有属性hidden - 一个<audio>仅当 controls 时才显示元素属性已设置。此外，您应该告诉浏览器您正在使用什么类型的音频。因此，您的音频标签应该是:

<audio id="song1" src="audio/ruins.wav" type="audio/x-wav" />

• 创建仅适用于一个实例的函数是一种不好的做法。你最好通过 1作为参数，所以你会:

<div id="pixelbutton" onClick="musicplay(1);"> </div>

• 只需设置 autostart属性可能不会使其自动启动。相反，请使用 .play()方法。有了这一点和上面的一点，你就会得到:

function musicplay(id) {
    document.getElementById('song'+id).play();
}

• 最后，除非 self 上次检查以来情况发生变化，否则只有 IE 和 Firefox 支持 WAV，Chrome 不支持。

希望这有帮助。