Question

我想把它放在有人点击显示在fancybox中的图像的地方我希望将product_url数据属性传递给Fancybox以获取类似下载链接的内容。

我已经设置了fiddle here进行测试，但似乎无法让它发挥作用。我将在页面上有多个带有fancybox的图像，每个图像都有自己的data-product_url属性。

<a rel="gallery" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin imperdiet augue et magna interdum hendrerit" class="fancybox" href="http://fancyapps.com/fancybox/demo/1_b.jpg" data-product_url="http://google.com"><img src="http://fancyapps.com/fancybox/demo/1_s.jpg" alt=""/></a>

<a rel="gallery" title="Proin imperdiet augue et magna interdum hendrerit" class="fancybox" data-product_url="http://yahoo.com" href="http://fancyapps.com/fancybox/demo/2_b.jpg"><img src="http://fancyapps.com/fancybox/demo/2_s.jpg" alt=""/></a>

$(".fancybox").fancybox({
    afterLoad: function() {
        var url = $(this, '[data-product_url]');
        this.title = '<a href="' + url + '">Download</a> ' + this.title;
    },
    helpers : {
        title: {
            type: 'inside'
        }
    }
});

Answer 1

使用$(this.element).data("product_url")代替$(this, '[data-product_url]');来获取此元素数据标记，您就可以了。

这是一个有效的jsfiddle

将数据属性传递给fancybox

1 个答案: