HTML5音频控件无法在Android上运行

时间:2017-11-17 01:41:00

标签: html5 audio

我创建了一个包含8个音轨的网页,每个音轨都使用自己的音频和源标签:

HTML

<ul>
  <li> Sleepwalk <br><audio controls> <source src="sleepwalk.mp3" type="audio/mpeg" /> </audio></li>
  <li>Sunny <br><audio controls> <source src="sunny.mp3" type="audio/mpeg" /> </audio></li>
        <li>Georgia on My Mind<br>
          <audio controls> <source src="georgia.mp3" type="audio/mpeg" /> </audio></li>
  <li>All of Me <br><audio controls> <source src="allofme.mp3" type="audio/mpeg" /> </audio></li>
        <li>The Shadow of Your Smile<br>
          <audio controls> <source src="shadow.mp3" type="audio/mpeg" /> </audio></li>
  <li>Mr. Sandman <br><audio controls> <source src="sandman.mp3" type="audio/mpeg" /> </audio></li>
  <li>Chestnuts (The Christmas Song) <br><audio controls> <source src="chestnuts.mp3" type="audio/mpeg" /> </audio></li>
  <li>White Christmas <br><audio controls> <source src="white.mp3" type="audio/mpeg" /> </audio></li>
</ul>

在我的显示器上,这可以正常工作(http://mikeytheking.com/guitarmusic.html),但在我的Android上,我看到每个控件的左半部分,但点击什么也没做。

请告知。

1 个答案:

答案 0 :(得分:0)

使用此.. ..

        <script type=text/javascript>
    var maudio = document.getElementById('myaudio');

    var soundSprite = [{
            start: 0,
            end: 3000
        },
        {
            start: 3500,
            end: 6789
        }
    ];

    element.addEventListener('touchstart', function(ev) {
        maudio.play();
        playSoundFile(0);
    })

    function playSoundFile(idx) {
        maudio.currentPosition = soundSprite[idx].start;
        var x = setInterval(function() {
            if (maudio.currentPosition >= soundSprite[idx].end) {
                maudio.pause(); // There is no stop() in HTML5
                clearInterval(x);
            }
        }, 50);
    }
</script>

    <audio src="sprite.mp3" controls="none" id="myaudio" />