Question

我需要一个方法来启用和禁用任何元素。禁用含义将不透明度设置为0.6并删除onClick回调。启用含义将不透明度设置为1并再次添加回调。

我的前两次尝试失败了，callback方法刚刚堆叠，而不是每次点击后运行一次，方法运行的次数越来越多。

function disableElement(element){
    var el = $('#'+element); 
    el.css('opacity','0.6');
    el.on('click',null);     //this doesn't work
            el.removeAttr('onClick'); // this doesn't help either.

}

function enableElement(element,callback){
    var el = $('#'+element); 
    el.css('opacity','1');
    el.on('click',callback);            
}

然后我尝试使用el.data：

disableElement:function(element){
        var el = $('#'+element); 
        el.css('opacity','0.6');
        el.data('element-enabled','false');
        //el.click(function (){
        //  alert('disabled');
        //});           
    },

    enableElement:function(element,callback){
        console.log('enabling');
        var el = $('#'+element);
        console.log(el);
        if(el.data('element-enabled') == "true")
            return;
        console.log("setOpacity");   
        el.css('opacity','1');
        el.data('element-enabled','true');
        el.click(function(){
            if(el.data('element-enabled') == "true")
                callback();
        }); 

    }

现在他们不会堆叠，只要我不禁用它。如果我禁用然后再次启用它，它会堆叠。这意味着，如果我多次运行enableElement，则回调不会堆叠。但是一旦我运行disableElement然后启用EnableElement，如果我点击该项目，它将发生两次。

能以某种方式实现吗？

更新

那很接近。关闭工作对我来说，但我也必须在enableElement上删除它。偶尔我必须打两次电话，所以它仍在堆叠。最后这个工作了，谢谢！

disableElement:function(element){
    var el = $('#'+element); 
    el.css('opacity','0.6');        
    el.off('click');

},

enableElement:function(element,callback){       
    var el = $('#'+element);
    el.off('click');                    
    el.css('opacity','1');      
    el.on('click',callback);    

}

Answer 1

要删除活动，请使用.off()

el.off('click');

要添加事件，您可以执行

el.on('click',callback);

Answer 2

您需要在.off中使用.off('click')。这将删除click类型的所有绑定事件。 Documentation for .off

请注意，如果您使用.off，则不会返回该事件或任何内容，您也不能简单地使用.on重新绑定。但是，由于您已在单独的函数中定义了回调，因此您最好重新绑定为.on('click', function_name)。这只是需要注意的事情。

Answer 3

Unbind将删除为某个事件分配给该对象的所有处理程序：

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

您还可以通过将其添加为第二个参数

将其设置为某个特定功能

$('#foo').unbind('click', myfunctionname);

如何删除onClick，然后再添加它？

3 个答案: