如何从选择器中解绑定fanybox

How to unbind fancybox from a selector

本文关键字：绑定 fanybox 选择器      更新时间：2023-09-26

我有一个锚链接与一个类，识别它被调用在fanybox。例子:

<a class="group">some code here</a>

Fancybox绑定:

$('.group').fancybox();

如果我想取消绑定fanybox与$('.group')选定的元素，我应该怎么做?我试过removeClass('group')，但它不起作用。

$('.group').unbind('click.fb')

你可以添加类"nofancybox"到链接中，这个链接将被忽略

如果你想在javascript代码中这样做，你可以选择锚标记对象并删除类。

给元素一个id并调用removeClass方法

<a id="noFancy" class="group">some code here</a>

Java脚本
 $(function(){
     $("#noFancy").removeClass("group");
 });

如果您可以访问HTML标记，为什么不直接将class更改为具有相同CSS值的其他内容呢?然后你不需要执行代码来移除documentready

上的类HTML 

<a class="groupNormal">I dont want fancybox</a>
CSS 

.groupNormal
{
  // Put the CSS for group class
}

这是对我有效的解决方案，但是它并没有在提问者想要如何做的意义上解除对花哨盒子的绑定。

首先，不要在节点上声明fancybox，而是将节点绑定到click事件:

$(".classOfMiniImage").on("click", window.onImageMiniClicked);

在处理程序中，您可以使用代码检查是否需要显示fancybox的条件，然后使用显式href引用显示它:

window.onImageMiniClicked = function () {
    if (<your_condition>) {
        $.fancybox({
            'href': <link_to_full_size_image>,
            /* other options below */
            'transitionIn': 'elastic',
            'transitionOut': 'elastic',
            'speedIn': 600,
            'speedOut': 600,
            'overlayShow': true
        });
    }
}

另外，如果您不再需要这些项上的fancybox，您可以使用另一种方法手动解除绑定此处理程序:

$(".classOfMiniImage").off("click", window.onImageMiniClicked);

希望对大家有所帮助。

相关文章：