Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/87.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 接收错误“;play()失败,因为用户没有';“不要先与文档交互”;事件侦听器正在执行play()方法时_Javascript_Html_Audio_Html5 Audio - Fatal编程技术网

Javascript 接收错误“;play()失败,因为用户没有';“不要先与文档交互”;事件侦听器正在执行play()方法时

Javascript 接收错误“;play()失败,因为用户没有';“不要先与文档交互”;事件侦听器正在执行play()方法时,javascript,html,audio,html5-audio,Javascript,Html,Audio,Html5 Audio,尽管需要用户输入来触发音频对象的播放方法,但仍获取以下错误消息。它似乎开始工作,但只有在第二次触摸控制元件之后 script.js:24未捕获(承诺中)DomeException:play()失败,因为用户没有首先与文档交互。 JS const control = document.querySelector(".control") const audioElement = new Audio('Music/9oclock.mp3') const playbtn = docu

尽管需要用户输入来触发音频对象的播放方法,但仍获取以下错误消息。它似乎开始工作,但只有在第二次触摸控制元件之后

script.js:24未捕获(承诺中)DomeException:play()失败,因为用户没有首先与文档交互。

JS

const control = document.querySelector(".control")
const audioElement = new Audio('Music/9oclock.mp3')
const playbtn = document.querySelector("#play")
const pausebtn = document.querySelector("#pause")

let playing = false;

control.addEventListener("touchstart", function () {
    playMusic()
})

function playMusic() {

    if (playing) {

        playing = false;
        pauseAudio();
        playbtn.style.display = "block"
        pausebtn.style.display = "none"

    } else {

        playing = true;
        playAudio();
        playbtn.style.display = "none"
        pausebtn.style.display = "block"

    }

}

function playAudio() {
    audioElement.play();
}

function pauseAudio() {
    audioElement.pause();
}