Question

下面的代码加载了一些音频资源，并根据数组sNumbers播放文件。每个文件都有onended事件以播放下一个事件，依此类推。问题是，当它第一次加载HTML页面时，这些音频根本无法播放。它引发消息Uncaught (in promise) DOMException 第二次，当我在Chrome上按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>

在Chrome上播放Javascript中的MP3序列

0 个答案: