jquery點擊處理程序只能工作一次

我已經開始學習jquery（今天），並正在通過一些非常簡單的例子，但已經遇到了問題。點擊一天的按鈕，我改變身體，併爲夜間按鈕再次提供不同的背景。（我知道很簡單），但我發現的是，點擊處理程序只工作一次，如果我先點擊夜間按鈕，然後一天按鈕不會工作？jquery點擊處理程序只能工作一次

任何人都可以建議或與之分享最佳做法？

在

http://jsbin.com/ufadul/3/edit

實例非常感謝

來源

2012-08-01 Richlewis

你需要交朋友在瀏覽器中使用JavaScript調試器。如果您懷疑點擊處理程序無法用於後續點擊，就像您一樣，不要假設，在點擊處理程序中設置斷點並單擊該按鈕。您會立即注意到該處理程序正在運行，並且該類將添加到正文中。如果您之後在瀏覽器中使用了DOM檢查器，則會立即看到問題。 [於是去安裝Chrome瀏覽器，然後按F12事不宜遲！（http://www.youtube.com/watch?v=NLqswS6r-e0） – bzlm 2012-08-01 09:25:25

該腳本將繼續增加這些類，你的身體標記，而不是取代它們。由於在CSS中的位置，.night優先於.day。

使用以下方法來防止這種情況發生：

$(function() { 
    $('button#first').click(function() { 
     $('body').removeClass('night'); 
     $('body').addClass('day'); 
    }); 

    $('button#second').click(function() { 
     $('body').removeClass('day'); 
     $('body').addClass('night'); 
    }); 

    });

來源

2012-08-01 09:16:57 Curt

你剛纔打我給它 – CKKiller 2012-08-01 09:17:45

黑暗爲準！哦，只是CSS訂購。對。 – bzlm 2012-08-01 09:18:07

感謝curt，我明白了，菜鳥的錯誤:) – Richlewis 2012-08-01 09:20:35

嘗試刪除類也本應理清您的問題

$(function() { 
    $('button#first').click(function() { 
     $('body').addClass('day'); 
     $('body').removeClass('night'); 
    }); 

    $('button#second').click(function() { 
     $('body').addClass('night'); 
    $('body').removeClass('day'); 
    }); 

    });

來源

2012-08-01 09:18:23

$(function() { 
    $('button#first').click(function() { 
     $('body').attr('class','day'); 
    }); 

    $('button#second').click(function() { 
     $('body').attr('class','night'); 
    }); 

});

demo

來源

2012-08-01 09:23:10 Uttara

jquery點擊處理程序只能工作一次

回答

相關問題