0

我有以下花式电话：

  $(document).ready(function() {
        $('.fancybox').fancybox({
            'closeClick'  : false,
            'scrolling'   : 'no',
             afterShow: function(){
            //do some stuff  
             }
        });
    });

对以下方面的影响：

<a href="example_url" class="fancybox fancybox.iframe"><img src="example"/></a>

我想做的是将href添加到fancybox调用中，这样我就可以简单地将hash标签放在html的href中。

  $(document).ready(function() {
        $('.fancybox').fancybox({
            'closeClick'  : false,
            'scrolling'   : 'no',
                'href'        : 'example_url',
             afterShow: function(){
            //do some stuff  
             }
        });
    });

但我需要更进一步。假设我要考虑三个不同的项目：

<a href="#" class="fancybox fancybox.iframe"><img src="example"/></a> //requires url-1
<a href="#" class="fancybox fancybox.iframe"><img src="example"/></a> //requires url-2
<a href="#" class="fancybox fancybox.iframe"><img src="example"/></a> //requires url-3

我知道我需要给每个人某种类型的唯一标识符。此外，我意识到我可以为每个调用三个不同的 fancybox 调用，但我认为更好的方法是这样的：

  $(document).ready(function() {
        $('.fancybox').fancybox({
                //do some processing here to find out what triggered the fancybox, then set a variable with the proper href based on that input. Could have a switch statement etc
            'closeClick'  : false,
            'scrolling'   : 'no',
                'href'        : //variable holding proper url
             afterShow: function(){
            //do some stuff  
             }
        });
    });

但是我很难让它像我想象的那样真正发生！

4

1 回答 1

1

编辑：我应该说我的示例使用的是 Fancybox 2，它可能在早期版本中不起作用

您可以让链接带有 data-href 属性，您可以像这样在fancybox调用中使用它（小提琴：http: //jsfiddle.net/xEtZ8/）

<a class="fancybox" data-href="http://fiddle.jshell.net/YtwCt/show/" href="#">URL 1</a>

<a class="fancybox" data-href="http://doc.jsfiddle.net/use/echo.html" href="#">URL 2</a>

和 JS

$(function() {
    $('.fancybox').fancybox({
        type: 'iframe',
        beforeLoad: function() {
            this.href = this.element.data('href');
        }
    });
});
于 2013-05-02T20:46:52.267 回答