【问题标题】:Set interval play audio only loop audio once?设置间隔播放音频只循环音频一次?
【发布时间】:2018-03-01 19:43:32
【问题描述】:

我有一个设定的时间间隔,在设定的时间间隔内,我有一个只需要播放一次的声音,但问题是声音一直在循环,并且不会停止,有人知道我在做什么吗?这是我尝试过的错误: html:

<audio id="swoosh">
  <source src="/resources/music/swoosh.mp3" type="audio/mpeg">
</audio>

js:

    var swoosh = document.getElementById("swoosh");

    setInterval(function () {
        if ($('.c:contains("01")').length > 0) {
            $(".links #abt").attr("href", "about.html");

            swoosh.addEventListener('ended', function () {
                swoosh.pause();
                swoosh.currentTime = 0;
                swoosh.loop = false;
            }, false);
            swoosh.play();

            //
            if ($('.c:contains("02")').length > 0) {
                $(".links #work").attr("href", "work.html");

                swoosh.addEventListener('ended', function () {
                    swoosh.pause();
                    swoosh.currentTime = 0;
                    swoosh.loop = false;
                }, false);
                swoosh.play();
            }
        }
    }, 10);

目的是在class="c" 的内容发生变化时播放声音,因此如果内容为 01,则音频应播放一次,然后暂停或停止,然后当它更改为 02 时,应再次播放,然后停止或暂停等ETC 提前致谢。

【问题讨论】:

  • 如果你想让它只播放一次,你为什么要把你的代码放在一个内部回调中?根据定义,区间会做多次事情。
  • 使用 setTimeout 而不是 setInterval
  • @Utkanos 因为我需要反复检查 .c 的内容以检查它何时更改为 02,03,04 等
  • @Sam setTimeout 适用于第一张幻灯片,但更改为幻灯片 02,03,04 等声音不播放,我更新了我的问题以提供更多示例我正在努力。
  • 使用setInterval获取.c的值,并将其存储为变量。如果下一个循环获得的值与存储的变量不同,则播放声音。

标签: javascript setinterval html5-audio addeventlistener


【解决方案1】:

我认为您正在尝试这样做。存储在一个变量中,“最后的声音”被复制,并且只有在它改变时才会播放新的声音。 “结束”事件的监听器是不必要的,因为每次更改只播放一次。

var swoosh = document.getElementById("swoosh");
var lastPlay = "00";

setInterval(function () {
    var cValue = $('.c').text();
    if (lastPlay != "01" && cValue.indexOf("01") >= 0) {
        $(".links #abt").attr("href", "about.html");
        swoosh.play();
        lastPlay = "01";
    }
    else if (lastPlay != "02" && cValue.indexOf("02") >= 0) {
        $(".links #work").attr("href", "work.html");
        swoosh.play();
        lastPlay = "02";
    }
}, 10);

其他更好的方法是为“.c”元素的更改事件添加一个监听器,它避免了每 10 毫秒的“查询”。但是我没有足够的代码给你看。

【讨论】:

    猜你喜欢
    • 2012-03-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多