Javascript afterShow click事件中未定义fancybox

我在页面加载时调用了以下代码：

$('#postcodes-link').fancybox({
    type: 'ajax',
    minWidth: 800,
    minHeight: 400,
    afterShow: function () {
        $('table.data-table > tbody > tr').on('click', function () {
            $.fancybox.close();
        });
    }
});

现在，打开fancybox（）可以正常工作，但当我单击该行时，它不会关闭fancybox，只会抛出以下错误：

未捕获的TypeError:无法读取未定义的属性“close”

但是，如果我将上述内容转换为jQuery函数：

(function ($) {
    $.fn.setUp = function () {
        return $(this).each(function () {
            $(this).fancybox({
                type: 'ajax',
                minWidth: 800,
                minHeight: 400,
                afterShow: function () {
                    $('table.data-table > tbody > tr').on('click', function () {
                        $.fancybox.close();
                    });
                }
            });
        });
    };
})(jQuery);

并在我调用顶层代码的相同位置调用以下代码

$('#postcodes-link').setUp();

fancybox现在将关闭（）。我的问题是为什么第一个不起作用而第二个却起作用，我如何才能使第一个起作用？我认为这与fancybox的作用域有关，但我认为第二个不会起作用，因为它被包装在另一个函数中

请注意，我尝试过各种版本的尝试关闭fancybox：

$.fn.fancybox.close()
jQuery.fancybox.close()
parent.$.fn.fancybox.close()
$('.fancybox-close').trigger('click') //tried this one as a dirty hack but didn't work either

---

好的，所以当我试图让小提琴复制错误时，我发现了问题所在：

在表页面上，我使用了jQuery数据表插件，因此我包含了加载该插件所需的所有脚本。当我使用ajax将页面加载到模式中时，这意味着jQuery将在当前页面上第二次加载。这导致了我所看到的错误

---

删除jquery脚本使fancybox按我所希望的方式工作，或者其他解决方法（如果您希望目标页面在没有以模式打开的情况下仍能工作-例如，如果您有指向该页面的其他链接），那么您必须使用fancybox iframe而不是fancybox ajax模式

您使用哪种浏览器？在firefox 37.0.1中，fancybox与第一个JSFIDLE很好地结合在一起。可能第一个JSFIDLE中的html不完整。我将FIDLE分叉并删除了close路径中的.fn。工作原理：对不起，我没有正确测试第一把小提琴，这是一把新小提琴：