Question

我正在尝试为您当前在Fancybox中查看的图片制作一个下载按钮。我认为这样做很容易，因为url已经存储在<img>标记中，所以我想我可以重新使用它作为链接。

我甚至试图在fancybox中找到<img>的{{1}}，然后在链接 src .append找到它href标签）。我只是缺乏jQuery技能来完成它。

要<a>我添加了fancybox.js代码：

<a>

我尝试复制并粘贴 <img class="fancybox-image" src="image.jpeg" alt="" /> <a href="" class="test">Download</a> ，但这样做不起作用：

image.jpeg

Answer 1

我不确定我是否理解您的问题，但您可以在fancyBox的标题区域内添加下载链接 - http://jsfiddle.net/zAe6Z/

$(".fancybox").fancybox({
    afterLoad: function() {
        this.title = '<a href="' + this.href + '">Download</a> ' + this.title;
    },
    helpers : {
        title: {
            type: 'inside'
        }
    }
});

Answer 2

jQuery方式

这个答案显示了如何使用标准的jQuery方法实现这一点，纠正OP给出的代码。 另请参阅Janis's answer ，了解如何使用Fancybox完成此操作。

您在此处发布的代码无效，因为href代码中没有<img>属性。您应该使用src属性：

var href = $('.fancybox-image').attr('src');
$('a.test').attr('href', href );

但是，只有当只有一个类.fancybox-image的图像时，这才有效。如果您的图库中有多个图像，请改用以下方法：

$('.fancybox-image').each(function (){
    var href = $(this).attr('src');
    $(this).next("a").attr("href", href);
});

Fancybox下载图片

2 个答案:

jQuery方式

jsFiddle here