Question

我有一个HTML5元素的示例。我需要在ajax请求之后动态创建音频元素并播放它。但它不适用于移动设备！ Android 4.1和IOS7。它在桌面上完美运行！页面加载后它不起作用。但它可以在按下按钮后按下按钮并按下控制按钮。为什么呢？

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script>
function play() {
    var audio = document.createElement('audio');
    audio.autoplay = true;
    audio.controls = true;
    audio.src='http://s3.amazonaws.com/audiojs/02-juicy-r.mp3';
    document.body.appendChild(audio);

    audio.play();
}

setTimeout(play, 1000);

</script>
</head>

<body>

<h1>test</h1>

<input type='button' value='Press Me' onclick='play()' />

</body>
</html>

Answer 1

我有同样的经验，在AJAX通话后音频无法播放。我想这与移动设备上的安全设置有关。移动浏览器的行为不同。尝试在移动设备上调用键盘时也会发生同样的情况。只有在按键或单击事件之后才能进行，但在页面加载或Ajax调用之后不能自动执行。

我使用的一个解决方案可能是在Ajax调用之外触发声音，如果首先触发Ajax调用的话。

HTML5音频元素不适用于移动设备

1 个答案: