如何简单实现视频预览和图片预览

某某l

于 2020-04-13 10:25:08 发布

阅读量3.9k

点赞数

分类专栏： Layerui jQuery 其他文章标签： javascript jquery html5

本文链接：https://blog.csdn.net/SunshineBlog/article/details/105482870

版权

本文介绍了在工作中如何使用JavaScript和HTML5轻松实现视频和图片的预览功能，提供了一种简单省事的方法，适合需要进行预览功能开发的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

工作需要做一个视频预览和图片预览，于是就发现了一个简单省事的预览方法，供大家参考一下，请多指教啊

    var videoExts = [".avi", ".mp4", ".wma", ".rmvb", ".rm", ".flash", ".3gp", ".flv", ".wmv"];
    var imgExts = [".bmp", ".jpeg", ".jpg", ".gif", ".png"];    
$("#preview").click(function () {
        var file = $("#ResUrl").val();//获取我那件路径
        if (file == null || file == "") {
            layer.msg("请先选择文件");
            return;
        }
        var ext = file.substring(file.lastIndexOf('.')).toLowerCase();//获取文件后缀

        var html = "";
        var title = "";
        if (imgExts.indexOf(ext) > 0) {
            title = "图片预览";
            html = "<img src='" + file + "' styl