使用 Fancybox 下载文件时如何更改文件名答案

【问题标题】：How can I change the name of the file when it's downloaded using Fancybox使用 Fancybox 下载文件时如何更改文件名
【发布时间】：2018-09-15 15:12:48
【问题描述】：

我有一个网格中包含各种图像的 div，该网格在页面加载时填充，并使用 Fancybox-3 在单击图像时启用缩放和下载功能。

上传文件时，我会在开头添加一个 8 位随机散列以确保没有重复项，并且需要在下载时删除此 8 位散列，以便用户获得与上传时使用的名称相同的文件。我搜索了各种来源，找不到答案

【问题讨论】：

“它是用Fancybox下载的”你怎么理解？点击下载按钮（从工具栏）时是否需要更改/自定义下载网址？
没错。我在工具栏上有一个自定义下载按钮，它使用 href 值作为从文件系统下载文件的路径。为了防止重复文件被覆盖，我在文件上传时添加了一个哈希。我需要删除哈希值，以便用户使用原始名称取回文件。

标签： javascript jquery download fancybox fancybox-3

【解决方案1】：

但是问题出在哪里？你有什么尝试吗？你不知道fancybox（像大多数js脚本/库一样）提供了丰富的API，所以你可以轻松1）使用回调执行你的代码？ 2）访问dom元素？

例子：

$('[data-fancybox="images"]').fancybox({
  buttons: [
    'zoom',
    'slideShow',
    'download',
    'thumbs',
    'close'
  ],
  afterShow : function(instance, current) {
    // This is how you can get src of current image
    console.info('current.src: ' + current.src);

    // This is how you can access dom elements
    instance.$refs.toolbar
      .find("[data-fancybox-download]")
      .attr("href", "https://t5.rbxcdn.com/3ec65288167d11dafe3f2dd674add32f");
  }
});

https://codepen.io/anon/pen/KxGLar?editors=1010

【讨论】：