当前第2页 返回上一页
代码如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <html>
<body>
<input type="file" id="file" onchange="onInputFileChange()">
<audio id="audio_id" controls autoplay loop>Your browser can't support HTML5 Audio</audio>
<script>
function onInputFileChange() {
var file = document.getElementById('file').files[0];
var url = URL.createObjectURL(file);
console.log(url);
document.getElementById("audio_id").src = url;
}
</script>
</body>
</html>
|
该代码在Chrome 30和Firefox 24上测试通过，在IE上应该存在一定的兼容性问题（据我所知IE8及以前的版本肯定是不能工作的），因为IE对HTML5的支持不好，不知道IE10有没有实现相关的API。
相关推荐：
HTML中的<meta>标签的使用详解
以上就是HTML5 Video/Audio播放本地文件的详细内容，更多文章请关注木庄网络博客！
返回前面的内容
相关阅读 >>
h5中indexeddb 数据库的使用方法详解
h5表单验证失败该怎样提示
h5+c3如何优化前端界面
如何自动获取HTML5的data-*属性示例代码详解
h5怎样实现输入框提示语+正常文本框提示语
exports和module.expors之间有什么区别及联系？
HTML5中的canvas 和 svg分别是什么？它们的区别在何处？（实例）
h5的localstorage本地存储使用详解
h5+webworkers多线程开发使用详解
用js+HTML5实现的小游戏-- 捕鱼达人游戏
更多相关阅读请进入《HTML5》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
转载请注明出处：木庄网络博客 » HTML5 Video/Audio播放本地文件
