| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <title>video file info</title> | |
| </head> | |
| <body> | |
| <script> | |
| function videoUpload() { | |
| var file = document.getElementById("fileUpload").files[0]; | |
| var filePreview = document.getElementById("filePreview"); | |
| if (file) { | |
| var fileSize = 0; | |
| if (file.size > 1024 * 1024) { | |
| fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + "MB"; | |
| } else { | |
| fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB'; | |
| } | |
| document.getElementById("fileName").innerHTML = "名称： " + file.name; | |
| document.getElementById("fileSize").innerHTML = "大小： " + fileSize; | |
| document.getElementById("fileType").innerHTML = "类型： " + file.type; | |
| var fileurl = window.URL.createObjectURL(file); | |
| var createVideo = document.createElement("video"); | |
| createVideo.setAttribute("src", fileurl); | |
| createVideo.setAttribute("controls", "controls"); | |
| createVideo.setAttribute("width", "640px"); | |
| filePreview.appendChild(createVideo); | |
| createVideo.onloadedmetadata = function () { | |
| document.getElementById("videoTime").innerHTML = "时长： " + formatTime(createVideo.duration); | |
| } | |
| } | |
| } | |
| function formatTime(time) { | |
| var time = time || 0; | |
| var h = parseInt(time / 3600), | |
| m = parseInt(time % 3600 / 60), | |
| s = parseInt(time % 60); | |
| h = h < 10 ? "0" + h : h; | |
| m = m < 10 ? "0" + m : m; | |
| s = s < 10 ? "0" + s : s; | |
| } | |
| </script> | |
| <form> | |
| <input type="file" name="fileUpload" id="fileUpload" onchange="videoUpload();" /> | |
| </form> | |
| <div id="filePreview"></div> | |
| <p id="fileName"></p> | |
| <p id="fileSize"></p> | |
| <p id="fileType"></p> | |
| <p id="videoTime"></p> | |
| </body> | |
| </html> |
实时预览视频、获取视频文件信息、视频时长
猜你喜欢
转载自blog.csdn.net/qq_41997807/article/details/80256197
今日推荐
周排行