在“touchstart”上播放音频然后在“touchend”上暂停音频时遇到问题。我正在使用 Howler.JS 库来做到这一点

Posted 2023-02-24

【中文标题】在“touchstart”上播放音频然后在“touchend”上暂停音频时遇到问题。我正在使用 Howler.JS 库来做到这一点

【英文标题】：Having trouble playing audio on "touchstart" and then pausing audio on "touchend". I am using Howler.JS library to do so

【发布时间】：2021-12-31 17:18:46

【问题描述】：

无法在“touchstart”上播放音频，然后在“touchend”上暂停音频。我正在使用 Howler.JS 库来执行此操作。如果您能提供帮助，请告诉我。目标是在用户触摸屏幕上的任何位置时播放一些音频。然后在用户抬起手指时暂停音频。目前，我可以在触摸屏上播放音频。但是，暂停侦听器没有响应。有什么想法吗？

Howler JS 链接：https://github.com/goldfire/howler.js

<script>
    document.addEventListener("touchstart", function(event) 
        var sound = new Howl(
            src: ['./audio/spray.mp3'],
        );
        sound.play();
    );
    document.addEventListener("touchend", function(event) 
        var sound = new Howl(
            src: ['./audio/spray.mp3'],
        );
        sound.pause();
        sound.currentTime = 0;
    );
</script>

【参考方案1】：

很久没有使用 Howler，但我认为问题在于 Howler 声音实例不同。当你这样做时：

var sound = new Howl(
 src: ['./audio/spray.mp3'],
);

您创建具有不同 ID 的不同实例。如果我没记错的话，您可以使用 ID 暂停声音或引用同一个实例。

因此，您必须保留对正在播放的声音实例的引用。

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。

@CarlosMolero 你会推荐另一种方法吗？如果是这样，你能分享一下吗？另外，如果我坚持使用 Howler，您能否分享一下您将如何通过延续当前实例来暂停它？