美文网首页
解决 Apple 设备不能自动播放 Audio 问题

解决 Apple 设备不能自动播放 Audio 问题

作者: _朽木 | 来源:发表于2018-04-25 13:59 被阅读0次

    在 safri 里面明确指出等待用户的交互动作后才能播放 media,也就是说如果你没有得到用户的 action 就播放的话就会被 safri 拦截,所以我们要用一些事件来控制
    touchstart 事件:当手指触摸屏幕时候触发,即使已经有一个手指放在屏幕上也会触发。
    touchmove 事件:当手指在屏幕上滑动的时候连续地触发。在这个事件发生期间,调用 preventDefault() 事件可以阻止滚动。
    touchend 事件:当手指从屏幕上离开的时候触发。
    touchcancel 事件:当系统停止跟踪触摸的时候触发。关于这个事件的确切出发时间,文档中并没有具体说明,咱们只能去猜测了。

    先要去监听 touchstart 事件,当用户触摸屏幕的时候去执行 playAudio 方法,同时监听播放事件,播放的时候移除 touchstart 的监听。

     var audio = document.getElementById("audio");
     window.addEventListener('touchstart', playAudio, false);
     audio.addEventListener('play', function () {
        window.removeEventListener('touchstart', playAudio, false);
    }, false);
    
    function playAudio() {
        if (audio.paused) {
            audio.load();
            audio.play();
        } else {
            audio.pause();
        }
    }

    相关文章

      网友评论

          本文标题:解决 Apple 设备不能自动播放 Audio 问题

          本文链接:https://www.haomeiwen.com/subject/fszelftx.html