javascript - Comment déclencher la lecture audio via des conditions dans WeChat sur iOS?
世界只因有你
世界只因有你 2017-05-18 11:00:50
0
2
576

Le code suivant veut réaliser que la page glisse vers une certaine plage pour lire 11.mp3, puis glisse vers une certaine plage pour lire 22.mp3. À ce moment, 11.mp3 se met en pause et joue en arrière, 22. Pauses mp3 et lectures 11.mp3.

Le code actuel ne peut pas être implémenté sans cliquer activement une fois pour jouer lors du premier chargement. Comment résoudre le problème ?

ps : Il n'y a pas de problème avec les navigateurs Android et PC, mais ce problème se produira dans WeChat d'iOS

<audio id="a1" src="http://mat1.gtimg.com/ln/images/mp3/11.mp3" auto loop controls  preload="auto"></audio>
<audio id="a2" src="http://mat1.gtimg.com/ln/images/mp3/22.mp3" loop controls  preload="auto"></audio>

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
function autoPlayAudio() {
    wx.config({
        // 配置信息, 即使不正确也能使用 wx.ready
        debug: false
        , appId: ''
        , timestamp: 1
        , nonceStr: ''
        , signature: ''
        , jsApiList: []
    });
    wx.ready(function () {
        var a1 = document.getElementById('a1'), 
            a2 = document.getElementById('a2');
        $(window).on('scroll', function () {
            var x = $('.audio2').offset().top - $(window).scrollTop();
            if (x < 4500 && x > 4000) {
                a1.play();
                a2.pause();
            }
            else if (x < 4000 && x > 3500) {
                a2.play();
                a1.pause();
            }
        })
    });
}
autoPlayAudio();
</script>
世界只因有你
世界只因有你

répondre à tous(2)
小葫芦

Restrictions de sécurité du système iOS

某草草

IOS restreint désormais la lecture automatique des effets sonores ou des vidéos, ce qui oblige l'utilisateur à cliquer au moins une fois.
C'est également une tendance dans les navigateurs désormais. Envisagez autant que possible d'autres solutions.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal