如何在Elfinder的Quicklook视频预览中禁用/移除下载按钮？

针对你遇到的问题，有几种可行的解决方式，按实现复杂度从易到难排列：

1. 用CSS直接隐藏按钮 #

如果是Elfinder自带的视频播放器下载按钮，或者浏览器原生视频控件的下载按钮，都可以通过自定义CSS隐藏：

/* 隐藏Elfinder内置播放器的下载按钮 */
.elfinder-quicklook .vjs-download-button {
    display: none !important;
}

/* 隐藏浏览器原生视频控件的下载按钮（针对HTML5 video标签） */
.elfinder-quicklook video::-webkit-media-controls-download-button {
    display: none !important;
}

将这段CSS添加到你的项目样式文件中即可生效。

2. 自定义Quicklook视频渲染逻辑 #

通过Elfinder的配置项，重写视频类型的Quicklook处理函数，给视频标签添加controlslist="nodownload"属性（这是浏览器标准属性，用于隐藏原生控件的下载按钮）：

$('#elfinder').elfinder({
    // 你的其他Elfinder配置项
    url: '/path/to/elfinder/connector',
    quicklook: {
        handlers: {
            // 重写视频类型的预览处理
            video: function(file, fm) {
                const video = document.createElement('video');
                video.controls = true;
                // 禁用下载按钮
                video.controlsList.add('nodownload');
                // 禁止右键菜单（可选，进一步限制下载）
                video.oncontextmenu = e => e.preventDefault();
                video.src = fm.url(file.hash);
                video.preload = 'metadata';
                return video;
            }
        }
    }
});

这种方式更灵活，能从根源上控制视频控件的行为。

3. 修改Elfinder源码（不推荐） #

如果上述方法都不适用，可以找到Elfinder负责渲染Quicklook视频的源码部分（通常在js/elfinder.min.js或对应的模块文件中），找到生成视频元素的代码，添加controlslist="nodownload"属性或移除下载按钮的渲染逻辑。但这种方式会导致后续Elfinder升级时需要重新修改，维护成本较高。

内容的提问来源于stack exchange，提问作者Benny Adiwijaya