暂停事件监听器

时间:2012-03-27 07:36:57

标签: javascript css animation mootools

我有一个附加onclick事件监听器的按钮(在MooTools中)。它工作正常。但是,我希望能够在某个时间使按钮不可用,并在必要时再次使用。

简单地说:我想'暂停'事件监听器。可以这样做吗? MooTools文档仅用于添加,删除,克隆和传播事件。暂时不“忽略”它们。

我知道解决方案可能在其他地方:

  1. 使用某些css隐藏按钮,例如$('button').setStyle('visibility', 'hidden')并让它稍后再次出现
  2. 一些叠加,再次隐藏原始元素,并显示替代(例如,灰显按钮)
  3. 克隆元素,从原始文件中删除所有事件(使按钮“不可用”),然后将原始文件替换为克隆(从而使其再次可用)
  4. 让附加到事件监听器的函数检查按钮是否可用
  5. 然而,这有点不重要,似乎更精细,然后是必要的。我的问题是我是否以及如何控制事件监听器,基本上是:我可以暂停它吗?

    修改

    我猜答案是'不'。这意味着要做上面提到的四件事之一,或者我接受的答案中提到的:禁用按钮HTML元素,从而暂停对事件监听器的响应。

3 个答案:

答案 0 :(得分:3)

我会看到两种方法:

  1. 禁用该元素。当元素具有disabled状态时,将禁用事件侦听器。
  2. 删除事件侦听器。这意味着一旦您想再次启用它,就必须重新添加它。这意味着您可以添加代码以在函数中添加事件,以便可以重复使用。

答案 1 :(得分:1)

虽然你找到了一个解决方案,但这里的一些答案似乎给你提供了很好的建议,但我写这个是为了完整。

虽然在我看来,处理问题的正确方法是在“按钮”中添加一个css类(记住你可以根据需要添加任意数量的类) (其中按钮可以是任何类型的元素)并使用类似这样的解决方案在您的点击处理程序中检查该类是否存在:

$('button.one').addEvent('click', function(){
   if(this.hasClass('disabled'))return;    
   alert('You just clicked me, guy!');
});

就像在这个例子中一样:

http://jsfiddle.net/kentaromiura/CUeC4/

另一条路径是添加像这样的自定义事件:

Element.Events.enabledClick = {
base:'click',
condition: function(event){
     var trigger = true;
     if(this.hasClass('disabled')){
        trigger = false;
     }
     return trigger;
}};

因此,只要你需要让你的事件处理程序进入休眠状态,你只需在你需要的按钮上添加一个“禁用”类并忘记它,重新启用该事件只需删除“禁用”类, 而不是addEvent('click',...)你只需使用addEvent('enabledClick',...)

在这个小提琴上使用以下相同的例子: http://jsfiddle.net/kentaromiura/yUnqw/

在我的例子中,我刚刚使用css中的.disabled类将按钮设置为禁用,但是如果你想让它消失,你可以使用补间来设置不透明度:

http://jsfiddle.net/kentaromiura/KLqAc/

答案 2 :(得分:0)

如果库不支持暂停事件,另一个选项是在你想忽略它时设置一个标志,然后在你的函数开始时检查它:

function doStuff() {
    if (myFlag) {
        return;
    }
}