Question

我正在使用FancyBox作为一个简单的图库，但我想从图像（即链接的子项）的SRC属性中自动设置链接HREF属性。这是我的HTML：

<ul id="gallery">
  <li><a href="#" rel="group" class="fancybox"><img src="images/01.jpg" alt="" class="picBorder" /></a></li>
  <li><a href="#" rel="group" class="fancybox"><img src="images/02.jpg" alt="" class="picBorder" /></a></li>
  <li><a href="#" rel="group" class="fancybox"><img src="images/03.jpg" alt="" class="picBorder" /></a></li>
</ul>

经过一些阅读后，我认为我可以使用 beforeLoad 回调来做到这一点，如下所示：

$(document).ready(function() {
    $(".fancybox").fancybox({
        beforeLoad : function(){
            var url= $(this.element).children("img").attr("src");
            this.href = url
        }
    });
});

唉，这不行。我更愿意在Fancybox中执行此操作，而不是在可能的情况下动态创建页面加载链接。

提前感谢您的任何建议!!!

编辑：为了澄清，没有出现控制台错误＆amp; fancybox的模态窗口显示正常“无法加载请求的内容。请稍后重试。”错误...这表明问题在于我如何遍历代码。

Answer 1

由于我无法直接解决此问题，因此我选择删除链接＆amp;在页面加载时生成。这是我用过的代码，以防万一：

$(document).ready(function() {
   $('ul#gallery li').each(function() {
      var url =  $(this).children("img").attr("src");
      $(this).children("img").wrap('<a class="fancybox" rel="group" href="' + url + '" />');
   });
   $(".fancybox").fancybox();
});

从子图像src动态生成FancyBox链接href

1 个答案: