我正在尝试编写可在移动浏览器和桌面浏览器上使用的 RIA。这个应用程序的一个主要目标是播放声音。可能有 X 很多(截至目前，有 150 多个)
在某个用户操作上，我想创建一个新的音频对象，加载某个剪辑并播放它。理想情况下，我会创建一个新的“音频”对象，设置 src 等待加载然后播放。这适用于各种桌面浏览器，但似乎在 Android 4.2、Chrome 和普通浏览器上失败。
我尝试了 4 种不同的方式来包含音频:
- 仅包括(在 html 中)一个音频 block ，让它在运行时加载并调用 .play()；但是这有效 这意味着我必须创建 150 多个音频 block 。 (这适用于任何地方)
- 创建“音频”的新实例并动态设置 .src 属性，然后在加载完成时调用 .play()(这似乎只适用于桌面浏览器，不适用于我的手机)
- 使用 jQuery 创建新的音频标签，添加到 dom，等待加载然后播放(这似乎只适用于桌面浏览器，不适用于我的手机)
- 在 html 中添加音频标签，告诉它不要加载，等待用户交互，然后加载它，等待它准备好，然后播放(这在任何地方都有效)。
那么，最大的问题是，知道为什么这行不通吗？
** 编辑 ** 我知道一次只能播放 1 个文件，这就是我在这里要做的。项目(在功能上)类似于电话服务，您有 1 个人记录数字 0 - 9 ，然后它“说出”一个电话号码，所以 '5'.'5'.'5'.'0'.'1 '.....等等。所以一次输出 1 个音频流是完全可以接受的...只是让它播放，这就是问题所在。
截至目前，我有以下代码，也可以找到here
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
var $a1, $a2, $a3, $a4;
$(document).ready( function(){
_setupVars();
_addListeners();
})
function _setupVars(){
$a1 = $( "#audio1");
$a2 = $( "#audio2");
$a3 = $( "#audio3");
$a4 = $( "#audio4");
}
function _addListeners(){
$a1.click( _handleAudio1 );
$a2.click( _handleAudio2 );
$a3.click( _handleAudio3 );
$a4.click( _handleAudio4 );
}
function _handleAudio1 (){
$("#america")[0].play();
}
function _handleAudio2 (){
var a = new Audio();
$(a).on("canplay", function(){
a.play();
})
if(a.canPlayType("audio/mp3"))
a.src = "audio/test2.mp3";
else if(a.canPlayType("audio/ogg"))
a.src = "audio/test2.ogg";
}
function _handleAudio3 (){
var $x = $('<audio id="says">'+
'<source src="audio/test3.mp3">'+
'<source src="audio/test3.ogg">'+
'</audio>');
$x.on("canplay", function(){
$x[0].play();
})
$("#audioCont").append($x);
}
function _handleAudio4(){
var $x =$("#cat");
$x.on("canplay", function(){
$x[0].play();
})
$x[0].load();
}
</script>
</head>
<body>
<input type="button" id="audio1" value="play Audio Tag"/><br />
<input type="button" id="audio2" value="play audio object"/><br />
<input type="button" id="audio3" value="play dynamic Audio Tag"/><br />
<input type="button" id="audio4" value="play load Audio Tag, then play"/><br />
<audio id="america">
<source src="audio/test1.mp3">
<source src="audio/test1.ogg">
</audio>
<audio id="cat">
<source src="audio/test4.mp3">
<source src="audio/test4.ogg">
</audio>
</body>
</html>
最佳答案
目前，Android 版 Chrome 明确需要用户通过手势“调用”播放音频。人们担心移动设备带宽过载或创建烦人的仅播放音频的弹出窗口 - 这是默认情况下禁用它的原因之一。
我们正在考虑改变这一点，如果您在 Android 上使用 Chrome 测试版，您可以访问此链接 chrome://flags/#disable-gesture-requirement-for-media-playback 它会让您切换此行为。我们正在处理这个问题，您可以关注 Bug 160536
关于javascript - 动态创建的音频对象无法在 Android Chrome 浏览器中播放，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17005140/