javascript - Javascript：iOS/Safari 和其他浏览器的简单点击声音

Question

我有一个我想在点击时播放的声音。一切都运行良好，除了 Safari/iOS。在 iPhone 上，这种声音只播放一次（第一次）。为了解决这个问题，我.load()之前添加了.play(). 现在，当我单击所需区域时，iPhone 也有声音。

var sound_obj = document.createElement("audio");
sound_obj.src="../sounds/clic.mp3";
sound_obj.volume=0.10;
sound_obj.autoPlay=false;
sound_obj.loop = false;
sound_obj.preLoad=true;
sound_obj.type = 'audio/mpeg';

$(document).on("vclick", ".elementwithsound", function () {
    sound_obj.load(); //this makes iOS to play the sounds but makes other browsers like firefox to throw errors sometimes
    sound_obj.play();
}); 

但是现在在控制台上，我GET https://xxxxxxx.xx/sounds/clic.mp3每次点击都有。另外，我有时会遇到以下错误sound_obj.load();：

Uncaught (in promise) DOMException: The fetching process for the media resource was aborted by the user agent at the user's request.

有没有一种很好的方法可以为 iOS 和 Android 实现这种点击声音而不会造成这种混乱？

标签： javascriptandroidios