使用 jquery 元素调用 fancybox答案

【问题标题】：Call fancybox with jquery element使用 jquery 元素调用 fancybox
【发布时间】：2010-11-13 07:49:57
【问题描述】：

我知道有一种方法可以使用 html 字符串手动调用 fancybox，如下所示：

$.fancybox("<div>foo</div>")

但是，我想将一个 jQuery 对象传递给 fancybox，这样我就可以保留我已经添加的 .data() 和 click() 事件：

var $fooObj = $("div.foo").data("foo","bar");
$.fancybox($fooObj);

这有可能吗？

【问题讨论】：

标签： javascript jquery jquery-plugins fancybox

【解决方案1】：

您只需在传递给$.fancybox() 的选项中将其设置为content 属性，如下所示：

$.fancybox({
    content: $fooObj 
});

You can test it out here.

【讨论】：

太棒了！不敢相信他们在对“内容”属性的描述中没有让这一点更加明显。谢谢！！！

【解决方案2】：

function LaunchFancyBox(code)
{
    jQuery.fancybox({
        content: code 
    });     
}

并且在 onclick/click 中：

<a href="#" onclick="LaunchFancyBox('<div>test</div>'); return false;">Launch it baby</a>!

【讨论】：

【解决方案3】：

简单的方法！！！

$(document).ready(function () {
    $.fancybox({
        'width': '80%',
        'height': '80%',
        'autoScale': true,
        'transitionIn': 'fade',
        'transitionOut': 'fade',
        'type': 'iframe',
        'href': 'http://www.example.com'
    });
});

【讨论】：