Question

嗨我需要循环音频文件一定次数，即4，我的声音文件循环正确，代码如下。？如何在4x之后停止循环，非常感谢P

$('#play_audio').click(function () {
            var audio = document.createElement("audio");
            audio.src = "files/windows%20default.mp3";

            audio.addEventListener('ended', function () {
                // Wait 500 milliseconds before next loop

                setTimeout(function () { audio.play(); }, 500);
            }, false);           

            audio.play(); 
    });

Answer 1

我设法做到了这样：

 $('#play_audio').click(function () {                     
            var times = 4;
            var loop = setInterval(repeat, 500);

        function repeat() {
            times--;
            if (times === 0) {
                clearInterval(loop);
            }

            var audio = document.createElement("audio");
            audio.src = "files/windows%20default.mp3";

            audio.play();
        }

        repeat();           
    });      
});

Answer 2

或许更好的方法是保持HTML不变。只需使用特定ID进行定位即可。

Array ( [0] => Array ( [0] => 854273_19 [1] => Beds [2] => 61 [3] => Autumn Winter 2012 [4] => Divans [5] => Fabric [6] => Storage Bedding [7] => Single Divan [8] => Not Required [9] => Fabric [10] => White [11] => Not Required [12] => Not Required [13] => [14] => Not Required [15] => Divan With Mattress [16] => Not Required [17] => Not Required [18] => Not Required ) ) 0

以下是JavaScript：

<audio id="loop-limited" controls>
    <source src="music.ogg" type="audio/ogg">
    <source src="music.mp3" type="audio/mpeg">
</audio>

Answer 3

使用类似的计数器抛出一个简单的if语句：

<击>更新：

<击>

$('#play_audio').click(function () {
            var audio = document.createElement("audio");
            audio.src = "files/windows%20default.mp3";

            audio.addEventListener('ended', function () {

                var repeat = 0;

                // Wait 500 milliseconds before next loop  
                setTimeout(function () {
                      if repeat < 3 {
                           var repeat = repeat + 1;
                           audio.play();
                      }
                      else {
                           return done;                
                      }
                }, 500);

            }, false);

      audio.play();
});

<击>

第二次更新：

$('#play_audio').click(function () {
        var audio = document.createElement("audio");
        audio.src = "files/windows%20default.mp3";        

        delay(500).audio.play();
        delay(1000).audio.play();
        delay(1500).audio.play();
        delay(2000).audio.play();
});

从编程的角度来看，它不具备可扩展性，但如果您只是尝试解决这一问题，那么这是一个可行的解决方法。

我确定如果我有更多的时间，我们可以聊聊也许我可以让循环代码正常工作，但试试这个，让我知道它是否有效。

Answer 4

我最近有类似的情况，我用这样的代码解决了它：

var ringsToPlay = 4;
var sound = new Audio('http://www.oneoakway.com/_inactive/oldfiles/chimebang.mp3');
var currentRing = 0;

function doIt() {
    sound.volume = .4;
    sound.play();
    currentRing = 1;
    sound.addEventListener('ended', ringMore, false);
}

function ringMore() {
    if(currentRing == ringsToPlay) {
        sound.removeEventListener('ended', ringMore, false);
    } else {
        sound.play();
        currentRing++;
    }
}

请注意，我只为最新的浏览器编码。我不知道这是否适用于旧浏览器，可能不适用。我只在FF，Chrome和IE，最新版本，Windows 7中测试我的代码。

Fidlle：http://jsfiddle.net/fidnut/2oL5fsxz/1/

Answer 5

加载页面时只是吓唬他们...... 但是，谢谢我正在寻找一种方法来做到这一点，

$(document).ready(function () {
    var times = Math.floor((Math.random() * 5) + 1);
    var loop = setInterval(repeat, 500);

    function repeat() {
        times--;
        if (times === 0) {
            clearInterval(loop);
        }

        var audio = document.createElement("audio");
        audio.src = "http://static1.grsites.com/archive/sounds/birds/birds001.wav";

        audio.play();
    }

    repeat();
});

https://jsfiddle.net/qmcw0cqq/

html5播放音频循环4x然后停止

5 个答案: