Question

我有一个代码，可以在鼠标移动时播放音频。现在，它只有一个声音用于左，另一个声音用于右。但是当我每次鼠标移动时使用随机方法从数组中使用不同的声音时，音频不会播放。基本上，我将音频的属性设置为新的声音文件索引src，但是Chrome无法播放音频。

这是演示链接： http://angeloplessas.com/flame/6/index5.html

这是链接，用于处理左右两侧的每个声音 http://angeloplessas.com/flame/6/index2.html

function getRandomSound() {
  var sounds = ["sound/New/new3.mp3", "sound/New/new4.mp3", "sound/New/new5.mp3", "sound/New/new6.mp3", "sound/New/new7.mp3", "sound/New/new8.mp3", "sound/New/new9.mp3", "sound/New/new10.mp3", "sound/left.mp3", "sound/right.mp3"];
  var indexLeft = Math.floor(Math.random() * (sounds.length));
  var indexRight = Math.floor(Math.random() * (sounds.length));
  var audioElementLeft = document.getElementById('left-audio');
  audioElementLeft.setAttribute('src', sounds[indexLeft]);
  var audioElementRight = document.getElementById('right-audio');
  audioElementRight.setAttribute('src', sounds[indexRight]);
}

我在鼠标移动功能中使用了getRandomSound()。

我收到一个Uncaught (in promise) DOMException错误

预期结果应该是音频应在左右扬声器上播放。

Answer 1

在不同情况下，您可能会遇到Uncaught (in promise) DOMException错误，

您的音频文件在加载之前播放（声音数据异步加载）。在这种情况下，您可以预加载音频文件，并在完全加载（https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/canplaythrough_event）后使用audio.oncanplaythrough事件播放该声音
您的音频文件是在没有用户交互的情况下播放的（您无法在页面加载开始时手动播放任何声音）。请参见autoplay属性（https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio#Attributes）以自动开始播放声音

使用JavaScript更改音频src时无法播放Chrome网络音频

1 个答案: