Код ниже загружает некоторые аудио ресурсы и в соответствии с массивом sNumbers воспроизводит файлы.Каждый файл имеет событие onended для воспроизведения следующего и так далее.Проблема в том, что при первой загрузке HTML-страницы эти аудиозаписи не воспроизводятся вообще.Он выдает сообщение Uncaught (in promise) DOMException Во второй раз, когда я нажимаю F5 на хроме, он работает нормально.
Я попробовал autoplay, надеясь, что аудио воспроизводится только после его загрузки.
<!DOCTYPE HTML>
<head>
<title>SENHA</title>
<script src="js1/jquery-3.2.1.min.js"></script>
<audio src="voz/notify.wav" id="somN" preload="auto"></audio>
<audio src="voz/senha.mp3" id="somS" preload="auto"></audio>
<audio src="voz/0.mp3" id="som0" preload="auto"></audio>
<audio src="voz/1.mp3" id="som1" preload="auto"></audio>
<audio src="voz/2.mp3" id="som2" preload="auto"></audio>
<audio src="voz/3.mp3" id="som3" preload="auto"></audio>
<audio src="voz/4.mp3" id="som4" preload="auto"></audio>
<audio src="voz/5.mp3" id="som5" preload="auto"></audio>
<audio src="voz/6.mp3" id="som6" preload="auto"></audio>
<audio src="voz/7.mp3" id="som7" preload="auto"></audio>
<audio src="voz/8.mp3" id="som8" preload="auto"></audio>
<audio src="voz/9.mp3" id="som9" preload="auto"></audio>
<audio src="voz/consultorio.mp3" id="somC" preload="auto"></audio>
<script type="text/javascript">
$(document).ready(function (){
let sNumbers = ['N', 'S', '1', '3'];
let audios = [];
sNumbers.map(function(e, i){
audios.push( document.getElementById("som"+sNumbers[i]) );
});
audios.map(function(e,i){
console.log(e);
if (audios.length-1 != i){
audios[i].onended = function(){
audios[i+1].play();
}
}
});
audios[0].autoplay = true;
}
);
</script>
</head>
<body></body>
</html>