Question

我想将一个函数绑定到特定facebox的关闭？根据{{3}}的有限文档，您可以执行类似这样的操作来绑定操作。

$(document).bind('close.facebox', function() {
    //do stuff...
})

但问题是它会将相同的动作绑定到页面上创建的所有facebox。

那么如何将不同的功能绑定到不同的facebox？我尝试了一些变种没有成功（可能是因为我还没有javascript和jQuery的masterlevelskills）：

绑定文档中提出的一个通用函数，并在函数中找出facebox关闭的内容并执行想要的操作。

在创建时获取facebox的句柄并使用它来绑定操作：

var fb = $.facebox('foo');
fb.bind('close.facebox', function() { ...do stuff ...})

直接在facebox上调用绑定，如：

$.facebox('foo').bind('close.facebox', function() { ...do stuff ...})

可能更多我不记得的变种......

请帮助我理解我应该怎么做（或者为什么我不应该这样做）。

Answer 1

在快速查看源代码后，我可以想到一个hack（！）来完成这项工作：

使用您拥有的方法覆盖facebox#close方法。
此方法的范围可让您访问刚刚点击的“关闭”链接
现在，您可以“横向”浏览您的内容并使用例如数据属性或类名，用于标识您当前正在显示的框
在此基础上，您可以做出决定该做什么。

以下是一个例子：

HTML：

<a href="#foo" class="facebox">Foo</a>
<a href="#bar" class="facebox">Bar</a>
<div id="foo">
    <div data-close="foo">Foo</div>
</div>
<div id="bar">
    <div data-close="bar">Bar</div>
</div>

JS：

$.facebox.close = function(e) {
    var type = $(this).prev().find('div:first').data("close");
    switch (type) {
    case "foo":
        alert("FOO");
        break;
    case "bar":
        alert("BAR");
        break;
    }
    $(document).trigger('close.facebox');
    return false
};

$('a.facebox').facebox();

在此处尝试：http://jsfiddle.net/SU3se/。

我认为该插件假设您不会在多个“不同”对象上使用它，并且因为您有时只能打开一个facebox，所以“应该”不是问题。但我可以理解为什么有人可能想要这样做。

请记住，我的解决方案是一个黑客，真的不是很漂亮。也许其他人可以想到更好的东西。

我可以将动作绑定到特定的facebox吗？

1 个答案: