Dojo JS ToggleButton顯示爲已啓用，但不允許單擊/切換和懸停大綱

Question

我需要使用ToggleButton來顯示圖像和一些文本，並且我希望按鈕顯示爲啓用（彩色圖標和黑色文本），但我不希望允許點擊/切換現在發生，因爲此功能將在稍後進行。我再次需要彩色圖標和文本黑色，但按鈕不可點擊（基本上應該看起來不像按鈕，懸停時沒有輪廓等）。

this.button = new ToggleButton({ 
         "id": title, 
         "label": count, 
         "showLabel": true, 
         "iconClass": "eIcon", 
         "class": "buttonText", 
         "disabled": true, 
       }); 

我不能讓CSS的正常工作 - 我試圖把顏色的按鈕，在CSS是這樣的：

.itpButtonText { color: black !important; } 

但它從來沒有被拾起。也許我需要做相反的事情，讓它啓用，但不允許懸停或點擊？

有沒有人有任何建議？

Answer 1

首先，有沒有什麼特別的原因需要用ToggleButton來實現呢？實際上，使用兩個div（一個用於img類，另一個用於文本）很容易實現您想要達到的效果，您只需保持一個狀態並根據此狀態對其進行相應設置。

如果您仍然需要使用toggleButton，則可以嘗試爲特定按鈕覆蓋一些默認樣式的ToggleButton。使用檢查器獲取您需要更改的對應類名稱，在您的主題CSS文件中搜索它們，然後將它們覆蓋在您自己的CSS文件中。

例如，覆蓋懸停的行爲，您可能需要overwrit

.claro .dijitToggleButtonHover .dijitButtonNode { 
    background-color: #86bdf2; 
    color: #000000; 
    -webkit-transition-duration: 0.2s; 
    -moz-transition-duration: 0.2s; 
    transition-duration: 0.2s; 
} 

與

.yourClass .claro .dijitToggleButtonHover .dijitButtonNode { 
    /* your styles */ 

} 

但是你可能需要做很多這樣的重寫的，所以也許這是更好地使用第一種方法創建自定義按鈕。