Javascript 如何使声音文件在多个重叠实例中播放？

我试图让声音文件播放得更快，以便跟上下面代码中显示的文本。声音正常（无论如何，在Firefox中），但一次似乎只播放文件的一个实例

我想让每一个字母都伴随着弹出的声音出现在屏幕上。现在，弹出的声音有点随机，而不是定时播放每个字母

我想知道我是否需要声音对象的多个实例，以及如何做到这一点

我已经尽可能地缩短了声音文件，文件的长度比我使用的

setTimeout

间隔短。它只是不会重叠同一个声音文件的多个副本，因为我不知道的原因，我确信

以下是全部代码：

（我试过了，但没能成功（我会把这个问题留到以后再说）

#展示{
颜色：白色；
字体大小：150%；
填充物：2米5厘米；
最小高度：600px；
最大宽度：600px；
左边距：自动；
右边距：自动；
}
身体{
背景色：黑色；
填充：0；
保证金：0；
}
var text=“测试字符串…1、2、3；似乎一切正常，但声音滞后。”；
var charDelay=40；//设置角色循环的延迟时间
函数loadText（）{
var i=0；//字符计数器
var myPud=新音频（“http://southernsolutions.us/audio/pud03.ogg");
var displayBox=document.getElementById（“显示”）；
displayBox.innerHTML=“”；
textLoop（）；
函数textLoop（）{
如果（i==text.length）{//此条件终止循环
displayBox.innerHTML+=“
”；
返回；
}else如果（i

我建议您把声音循环再长一点，比如1秒。然后，通过事件侦听器控制声音播放，以便在文本完成后停止声音播放

试着像现在这样做，你可以通过声音在音频文件中的播放来加速声音。这将产生更好的结果。否则，请放慢暂停时间

下面是我测试过的一些代码，它可以让您通过事件侦听器来完成。结果与您的相似，但如果您将音频文件增加到1秒，并将其更改为有24次点击，您将获得您想要的确切效果

编辑：我还更新了以下内容以考虑评论

   <script>
    var text = "Test String...   1, 2, 3; Everything seems to be working, but the sound is lagging.";
    var charDelay = 40;     // Sets the delay time for the character loop

    function loadText() {
        var i = 0; // Character counter
        var myPud = new Audio("http://southernsolutions.us/audio/pud03.ogg");
        var displayBox = document.getElementById("display");

        // Toggle for whether to loop
        var stillPlay = true;
        displayBox.innerHTML = "<p>";

        // Listen for when it ends
        myPud.addEventListener("ended", onAudioComplete);
        // Begin playing
        myPud.play();
        // Start the loop
        textLoop();

        function textLoop() {
            if (i == text.length){                  // This condition terminates the loop
                displayBox.innerHTML += "</p>";
                // If we're at the end, we want to stop playing
                stillPlay = false;
                // Rather than duplicate code, jump straight into the complete function
                onAudioComplete(null);
                return;
            } else if (i < text.length) {       // This condition appends the next character
                displayBox.innerHTML += text[i];
                i++;
                // Direct reference to the function to avoid more anony. functions
                setTimeout(textLoop, charDelay);
            }
        }

        // On audio complete
        function onAudioComplete(e){
            // Can we still play? If so, play
            if(stillPlay){
                myPud.play();
            } else {
                // Otherwise, remove the event listener, stop and null out.
                myPud.removeEventListener("ended", onAudioComplete);
                myPud.stop();
                myPud = null;
            }
        }
    }   

    window.onload = loadText; 
</script>

var text=“测试字符串…1、2、3；似乎一切正常，但声音滞后。”；
var charDelay=40；//设置角色循环的延迟时间
函数loadText（）{
var i=0；//字符计数器
var myPud=新音频（“http://southernsolutions.us/audio/pud03.ogg");
var displayBox=document.getElementById（“显示”）；
//切换是否循环
var stillPlay=true；
displayBox.innerHTML=“”；
//倾听它何时结束
myPud.addEventListener（“结束”，在音频完成时）；
//开始演奏
myPud.play（）；
//开始循环
textLoop（）；
函数textLoop（）{
如果（i==text.length）{//此条件终止循环
displayBox.innerHTML+=“
”；
//如果我们到了终点，我们想停止比赛
静态播放=假；
//不要重复代码，直接跳转到完整的函数中
onAudioComplete（空）；
返回；
}else如果（i

一个非常短的音频文件每秒播放25次。即使是正弦波周期也会在该点听起来像一个恒定的25hz低音；很可能不是你想要的。旁白：不要对事件使用额外包装：函数是函数，所以您可以设置超时（textLoop，charDelay），并设置window.onload=loadText；（这不是问题，但很好的做法）音频文件的长度是10毫秒。好的，我明白你的意思，从

loadText（）

中拉出

textLoop（）

，然后将变量作为参数传递。我能做到。这似乎很有效。我不得不使用

myPud.pause（）

而不是

.stop（）

，但这可能是一种很好的技术。顺便问一下，你有关于“清空”对象的讨论的链接吗？这是我第一次听说这件事，我想读一读。不是手边的，但通常的做法是在删除任何事件侦听器后将对象置零，以避免潜在的内存泄漏。如果答案是好的，请接受

   <script>
    var text = "Test String...   1, 2, 3; Everything seems to be working, but the sound is lagging.";
    var charDelay = 40;     // Sets the delay time for the character loop

    function loadText() {
        var i = 0; // Character counter
        var myPud = new Audio("http://southernsolutions.us/audio/pud03.ogg");
        var displayBox = document.getElementById("display");

        // Toggle for whether to loop
        var stillPlay = true;
        displayBox.innerHTML = "<p>";

        // Listen for when it ends
        myPud.addEventListener("ended", onAudioComplete);
        // Begin playing
        myPud.play();
        // Start the loop
        textLoop();

        function textLoop() {
            if (i == text.length){                  // This condition terminates the loop
                displayBox.innerHTML += "</p>";
                // If we're at the end, we want to stop playing
                stillPlay = false;
                // Rather than duplicate code, jump straight into the complete function
                onAudioComplete(null);
                return;
            } else if (i < text.length) {       // This condition appends the next character
                displayBox.innerHTML += text[i];
                i++;
                // Direct reference to the function to avoid more anony. functions
                setTimeout(textLoop, charDelay);
            }
        }

        // On audio complete
        function onAudioComplete(e){
            // Can we still play? If so, play
            if(stillPlay){
                myPud.play();
            } else {
                // Otherwise, remove the event listener, stop and null out.
                myPud.removeEventListener("ended", onAudioComplete);
                myPud.stop();
                myPud = null;
            }
        }
    }   

    window.onload = loadText; 
</script>