Question

我正在尝试在标题中放置一个链接，该链接基本上是选定的锚点href，带有前缀。我怎么能这样做？我希望能够在选定的锚元素上获得this.href。

$(".gallery-module > li > a").fancybox(
{
    title       : '<a href="'+ this.href + '-large">DOWNLOAD</a><br> High Resolution File, 300dpi'
});

Answer 1

当您绑定fancybox时：

$(".gallery-module > li > a").fancybox({
    title: '<a href="'+ this.href + '-large">DOWNLOAD</a><br> High Resolution File, 300dpi'
});

this不是匹配的<a>元素，this可能是window，因此this.href不是<a>的{ {1}}属性，href（可能）this.href，这不是您想要的标题。

如果您想使用fancybox中链接的信息，您可以使用each迭代匹配元素集，并将fancybox分别绑定到每个window.href：

<a>

在$('.gallery-module > li > a').each(function() { // 'this' will be the <a> in here $(this).fancybox({ title: '<a href="'+ this.href + '-large">DOWNLOAD</a><br> High Resolution File, 300dpi' }); });回调中，$('.gallery-module > li > a').each将是您正在寻找的this。

Answer 2

我假设您使用的是fancybox v1.3.x，不是吗？

使用该版本，除非在回调函数中，否则不能直接引用this.href。在您的情况下，您可以使用titleFormat选项来获得自定义标题，例如

$(".gallery-module > li > a").fancybox({
 titleFormat: function(){
  return '<div class="newTititleWrap"><a href="'+ this.href + '-large">DOWNLOAD</a><br> High Resolution File, 300dpi</div>'
 } 
});

请注意，我将自定义标题包含在DIV中 class = newTititleWrap（或您喜欢的任何内容），您可以稍后使用css设置样式

更新：我错过了标记fancybox-2（我的错误）。对于fancybox v2.0.6，请使用beforeShow回调选项，如：

 $(".gallery-module > li > a").fancybox({
   beforeShow : function() {
    this.title = '<div class="newTititleWrap"><a href="'+ this.href + '-large">DOWNLOAD</a><br> High Resolution File, 300dpi</dv>';
   } 
 }); // fancybox

我会发布v1.3.4的解决方案，以防它帮助其他人。

在Fancybox中定位href

2 个答案: