android webview 无法捕捉声音事件
我在用webview播放音频的时候,可以听到声音,却不能控制播放事件,试了好几台机器都是这样。下面是我的测试代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="initial-scale=1.0, width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
<title>audio tag test</title>
<style type="text/css">
#btn {
width: 200px;
height: 50px;
background: #1170C5;
border-radius: 25px;
color: #FFF;
text-align: center;
line-height: 50px;
}
</style>
</head>
<body>
<div id="btn">点我播放声音</div><br>
<div id="message"></div><br><br>
<audio src="audio/14.mp3" id="voice"></audio>
<!--<script type="text/javascript" src="js/debuggap.js"></script>-->
<script src="js/zepto.min.js"></script>
<script>
$(function(){
var audio = $('#voice')[0];
var mess = $('#message');
var startTime = Date.now();
var btn = document.getElementById('btn');
audio.oncanplay = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':文件就绪可以开始播放!(oncanplay)';
mess.append(htmltext);
}
$('#btn').click(function(){
audio.play();
});
audio.onended = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':音频已到达结尾!(onended)';
mess.append(htmltext);
}
audio.onerror = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':音频加载期间发生错误!(onerror)';
mess.append(htmltext);
}
audio.onloadeddata = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':音频数据已加载!(onloadeddata)';
mess.append(htmltext);
}
audio.onloadedmetadata = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':音频元数据已加载!(onloadedmetadata)';
mess.append(htmltext);
}
audio.onloadstart = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':音频文件开始加载但未实际加载任何数据!(onloadstart)';
mess.append(htmltext);
}
audio.onplay = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':音频已就绪可以开始播放!(onplay)';
mess.append(htmltext);
}
audio.onplaying = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':音频已开始播放!(onplaying)';
mess.append(htmltext);
}
audio.onprogress = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+':浏览器正在获取音频数据!(onprogress)';
mess.append(htmltext);
}
audio.onseeking = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+': seeking 属性设置为 true!(onseeking)';
mess.append(htmltext);
}
audio.onstalled = function(){
var time = Date.now() - startTime;
var htmltext = '<br>'+time+': 浏览器未能取回媒介数据!(onstalled)';
mess.append(htmltext);
}
});
</script>
</body>
</html>
在真机测试的时候,页面上没有跟踪到任何事件调用记录。请问需要对webview做什么设置,才能捕获音频播放事件呢?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
好吧,没人回答,我就自问自答了。
好像是因为webview里不支持 audio.onplaying = function(){} 这样的事件监听事件,改用:
$('audio').on('playing',function(){})
这样的格式,就可以成功监听事件了。有人能帮我解释一下这种现象背后的原因吗?