removeClass即刻起作用，addClass只適用於失去焦點

我有一些按鈕，它們允許用戶切換頁面上元素的可見性。當元素可見時，該按鈕應該突出顯示。removeClass即刻起作用，addClass只適用於失去焦點

當它變得不可見時，突出顯示會根據需要立即消失。但是當它變得可見時，突出顯示僅在按鈕失去焦點時出現。

if (column.visible()) {    
    $(button).addClass("highlight"); 
} 
else { 
    $(button).removeClass("highlight"); 
}

換句話說，「刪除CSS類」具有即時效果，但「添加CSS類」不會。這裏可能會發生什麼？

更新：這裏的的jsfiddle顯示此行爲：https://jsfiddle.net/f7cwfr3x/7/

2016-02-22 Ollyver

你在哪個事件下運行你的代碼？還要注意，你可以使它成爲一行：'$（button）.toggleClass（「highlight」，column.visible（））;' –

你可以在jsfiddle上覆制相同的內容。 http://jsfiddle.net – dreamweiver

@RoryMcCrossan它在點擊運行：$（'button.toggle-vis'）。on（'click'，function（e）... 感謝較短的版本;不幸的是問題仍然存在 – Ollyver

的工作的jsfiddle。我沒有看到任何問題。

$(button).toggleClass("highlight", column.visible());

當你第一次點擊，然後column.visible（）返回false，高亮類被刪除。當你第二次點擊按鈕時，column.visible（）== true - 高亮類被添加。

雖然，我不建議使用-webkit-對焦環的顏色輪廓，因爲它不支持大多數的瀏覽器，除了WebKit的。

2016-02-22 16:01:42 Farside

Thanks for關於-webkit的提示，它在Edge瀏覽器中完全沒有出現（它在Chrome中是我的默認設置）我絕對遵守我描述的行爲Chrome，突出顯示只出現在我點擊時出現。我會將CSS更改爲不同的高亮，並查看問題是否仍然存在。 – Ollyver

從輪廓改變：{-webkit-focus-ring-color auto 5px;}改爲{outline：2px solid rgb（94，158，214）;}似乎解決了這個問題。知道_why_發生的事情仍然很有趣，但我想這不是關鍵。 – Ollyver

@Olyly，如果我的答案以某種方式幫助你，你可能會贊成。關於你的問題 - 我真的不明白。沒有明顯的問題 - 代碼有效，我在上面解釋了它的工作原理。如果你期望不同的行爲，請詳細說明那裏有什麼問題。 – Farside

回答