HTML5 JS同时多次播放相同的声音

Posted 2023-02-25

【中文标题】HTML5 JS同时多次播放相同的声音

【英文标题】：HTML5 JS play same sound multiple times at the same time

【发布时间】：2014-09-03 22:23:17

【问题描述】：

我正在创建一个非常基本的 html5 游戏，但我碰了壁，基本上我有一个数组，这个数组填充了一个声音文件（它是一个数组，所以如果需要我可以分配更多的声音）

this.Sounds["L_Explosion1"] = new Audio("Assets/Sounds/Explosion_1.wav");
this.Sounds["L_Explosion1"].volume = 1;
this.Sounds["L_Explosion1"].load();

当玩家按下空格键时，我想播放声音，所以我运行这段代码

this.Sounds["L_Explosion1"].play();

但是，如果我在播放声音之前再次按空格键将不会播放它，我想要做的是多次播放相同的声音，如果尚未完成，我将如何实现这一点？

【参考方案1】：

为了同时播放多个声音实例，您需要创建该Audio 元素的新副本。一种方法是使用.cloneNode() 方法并在每次按下空格键时播放克隆的音频。

this.Sounds["L_Explosion1"].cloneNode(true).play();

【讨论】：

这个可以正常工作，但是你需要在cloneNode中提供一个参数（true or false）w3schools.com/dom/met_element_clonenode.asp

该链接指向 XML DOM .cloneNode() 方法，该方法确实需要参数。但是对于 HTML DOM .cloneNode()，参数是可选的。请参阅：w3schools.com/jsref/met_node_clonenode.asp 然而，Firefox 最近在其 .cloneNode() 实现中切换了可选参数的默认值，因此安全的做法是在使用 .cloneNode() 时始终提供参数。见：developer.mozilla.org/en-US/docs/Web/API/Node.cloneNode

每次按空格键都会复制声音吗？有没有办法清理声音？还是删除节点 on('ended') ？