这段代码演示了如何使用HTML5的`<audio>`标签和JavaScript处理用户选择的音频文件，实现文件选择后的立即播放功能。当用户选择文件后，文件URL会被转换为对象URL，并设置为音频元素的源，从而实现音频的播放。如果替换为`<video>`标签，此方法同样适用于视频文件的播放。
直接上代码，代码很简单，需要选择一个声音音乐文件
document.getElementById("file").addEventListener("change",function () {
var file = document.getElementById('file').files[0];
var url = URL.createObjectURL(file);
console.log(url);
document.getElementById("audio_id").src = url;
});
完整代码
<html>
<body>
<input type="file" id="file">
<audio id="audio_id" controls autoplay loop>Your browser can't support HTML5 Audio</audio>
<script>
document.getElementById("file").addEventListener("change",function () {
var file = document.getElementById('file').files[0];
var url = URL.createObjectURL(file);
console.log(url);
document.getElementById("audio_id").src = url;
});
</script>
</body>
</html>
以上是音频文件，如果是视频 ，将上面audio 改成 video 标签即可
<video id="audio_id" controls autoplay loop>Your browser can't support HTML5 Audio</video>
扫一扫
2321
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
