jQuery的禁用啓用鏈接

Question

這裏的事件處理程序的代碼：http://jsfiddle.net/4WyPq/

當我點擊「Button1的」，那麼它動畫禁用該按鈕，在那之後我需要按下按鈕2，並啓用「按鈕1」事件，以便所以基本上我再次按'button1'它應該做同樣的事件。

Answer 1

當您將點擊事件綁定到鏈接時，您必須包含點擊處理函數。

$(this).bind('click'); 

不做任何事情，因爲沒有處理函數。如果你想重新綁定它，你將不得不再次傳遞click處理函數。你可以通過將click處理程序分解到它自己的本地函數中，然後在每次綁定click事件時使用該函數來實現。你可以是這樣做的：

function bindA1(force) { 
    var a1 = $('.a1'); 
    if (force || a1.hasClass("disabled")) { 
     a1.click(function() { 
      $(this) 
       .addClass("disabled") 
       .unbind("click") 
       .animate({"top": "+=50px"}, "slow"); 
      return(false); 
     }).removeClass("disabled"); 
    } 
} 

bindA1(true); 

$('.a2').click(function() { 
    bindA1(); 
    return(false); 
}); 

工作演示在這裏：http://jsfiddle.net/jfriend00/3kjaR/

如果你真的打算啓用和禁用像這樣的鏈接的處理程序，它可能更容易只設置你檢查屬性而不是實際刪除事件處理程序。

你可以使用一個標誌是這樣的：

$('.a1').click(function(){ 
    if (!$(this).data("disabled")) { 
     $('.a1').animate({"top": "+=50px"}, "slow"); 
     $(this).data("disabled", true); 
    } 
}); 

$('.a2').click(function(){ 
    $(".a1").data("disabled", false); 
}); 
​ 

工作演示在這裏：http://jsfiddle.net/jfriend00/NSZ8P/

Answer 2

• 使用.off()刪除的處理程序
• 使用.on()綁定再次
• 使用可重複使用的綁定功能

demo：

$(function() { 

    function clickHandler() { 
     $(this).animate({ 
      "top": "+=50px" 
     }, "slow").off('click'); 
     return false; 
    } 

    $('.a1').on('click', clickHandler); 

    $('.a2').on('click',function() { 
     $('.a1').on('click', clickHandler); 
     return false; 
    }); 
});​ 

Answer 3

我打你的小提琴，並給你一個不同的選項，而不是與綁定事件的存儲位置搞亂，不得不讓所有困惑...試試這個：

http://jsfiddle.net/4WyPq/2/

$('.a1').click(function(){ 
    if(!$(this).hasClass("disabled")){ 
     $(this).addClass("disabled"); 
     $('.a1').animate({"top": "+=50px"}, "slow"); 
    } 
}); 

$('.a2').click(function(){ 
    $(".a1").removeClass("disabled"); 
});