禁用jQuery的.toggle()方法

Question

我正在寻找一种方法来禁用附加在div上的.toggle()。

if (condition) {
    $("#div").toggle(
        function() {
            do this
        },
        function() {
            do that
        }
    );
}
else {

    // How do I achieve this?
    $("#div").disableToggle(

    );
}

更多解释：

这是一个地图应用程序。所谓的toggle与图像按钮绑定。地图在缩放级别4下加载。用户缩放地图，当用户缩放到超过缩放级别6时，该按钮才变为活动状态。一旦用户缩小到小于级别6，我希望切换按钮再次变为非活动状态。

- punkish

---

最好的方法是解除切换添加的“点击”事件。我想回答，但现在时间不够了。 - Ben Lee

在这种情况下，您可能不应该使用toggle()函数；toggle()使用内部计数器，如果您尝试反复开关它，很可能会出现错误。 - Kato

我并不是想关闭 toggle()。更确切地说，我想在某些条件下禁用它。该应用程序依赖于特定的地图缩放级别。只有在正确的缩放级别下，切换才应处于活动状态。当用户移出缩放范围时，切换应该停用。 - punkish

Answer 1

为什么不直接解除点击事件绑定？

$('#div').unbind('click');

- Finbarr

---

“toggle”不是事件或事件处理程序。它是一个方便的函数，实际上添加了“click”处理程序。 - Ben Lee

所以我刚发现，解除单击事件似乎可以解决这个问题。http://jsfiddle.net/finbarr/gePha/ - Finbarr

最好的方法是解除切换添加的点击事件。我会回答，但现在没时间了。我不得不在工作中，所以无法发布特定的事件处理程序。你的答案移除了所有的事件处理程序。对于许多项目来说，这种严厉的方法是可以接受的，所以我投了赞成票。不过，我要提醒一下，这将删除所有的点击处理程序。 - Ben Lee

没错，那个方法可行。我期待着Ben Lee的“完整”答案，当他有机会发布时，但是现在，我并不太担心。那个特定的#div只附加了一个方法，所以删除它对我来说完全可以。 - punkish

Answer 2

您可以将条件放在函数内部：

$("#div").toggle(
    function() {
        if (condition) {
            //do this
        }
    },
    function() {
        if (condition) {
            //do that
        }
    }
);

- nachito

Answer 3

你可以使用 .cleanData() 方法:

// this will destroy all data bound to that element
$.cleanData($("#div"));

演示。

- karim79

---

@Ben Lee - 将最后一条语句注释掉，点击div将再次起作用。它会终止toggle()的执行。 - karim79

cleanData有文档吗？我正在谷歌搜索，但找不到任何解释它应该做什么的页面。 - Andrew Shepherd

@Andrew Shephard - 它在内部用于清理绑定到元素的数据，每当您执行.html（''）、.empty()等操作时，它被称为“底层代码”，以防止内存泄漏。 - karim79

它是操作模块的一部分。在这里声明：https://github.com/jquery/jquery/blob/master/src/manipulation.js#L735 - karim79

@Ben Lee - 我真是个傻瓜。我已经从我的答案中删除了它，因为我意识到它能工作的原因是它正在破坏JS :( - karim79

Answer 4

以下是一种方法：

移除用于切换的已选择类。示例代码：http://jsfiddle.net/leifparker/rSP34/2/

HTML

<div class="button_toToggle"> Toggle it! </div>
<div class="button_disableToggle"> Disable Toggle </div>
<div class="happyDiv togglable">&nbsp;</div>

JS

$('.button_toToggle').click(function(){
    $('.togglable').toggle();
});
$('.button_disableToggle').click(function(){
    $('.happyDiv').removeClass('togglable');
});

- leifparker

Answer 5

如果您没有将匿名函数传递给toggle()，则可以使用此论坛帖子中描述的技术来解除事件绑定。

- bfavaretto

---

遗憾的是，它不起作用。它会激活切换，但解除绑定没有发生。 - punkish