safari浏览器在iPad/iPhone、Android中不支持HTML5音频标签

Question

我正在做一个基于jquery动画的项目，它的动画在桌面（Firefox,chrome,opera,IE）上很好的工作，也支持HTML5音频标签，但在iPad/iPhone/Android safari音频标签不支持。它在iPad/iPhone/Android Firefox上工作很好。我在很多论坛上搜索过它，都没有得到想要的结果。我使用过这个函数：

function playmusic(file1,file2)   
{ 
    document.getElementById('music11').innerHTML='<audio id="music1"><source src="'+file1+'" type="audio/ogg"><source src="'+file2+'" type="audio/mpeg"></audio>';
    $("#music1").get(0).play();
 }   

Answer 1

尝试在音频标记上添加自动播放属性：

function playmusic(file1, file2) { 
    document.getElementById('music11').innerHTML='<audio autoplay id="music1"><source src="'+file1+'" type="audio/ogg"><source src="'+file2+'" type="audio/mpeg"></audio>';
}

不过，我建议构建一个适当的元素并将其插入DOM中-类似于以下内容：

function playmusic(file1, file2) { 

    var audio = document.createElement('audio');
    audio.preload = 'auto';
    audio.autoplay = true;

    if (audio.canPlayType('audio/ogg')) {
        audio.src = file1;
    }
    else if (audio.canPlayType('audio/mpg')) {
        audio.src = file2;
    }

    document.getElementById('music11').appendChild(audio);
}