爲什麼不按我期望的方式添加類？

Question

我有一個Meteor項目，並使用Materialise UI。我想改變，加入了獨特的邊界他們到處尋找的情態動詞，所以我發現了什麼Materialise的類是爲情態動詞，並加入了一些CSS

.materialize-modal { 
padding: 1em; 
border: 1em solid transparent; 
background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, red 0, red 12.5%, white 0, white 25%, #58a 0, #58a 37.5%, white 0, white 50%) 0/5em 5em; 
} 

但這當然，改變了所有的情態動詞。我的意圖是僅在其中一些上使用它。所以我想，如果我添加了一個類時，一個模式被觸發（一個模式，我不想讓特殊邊框），我可能只是在觸發時添加一個類：

$('.materialize-modal').addClass('plain'); 

現在用CSS：

.materialize-modal:not(.plain) { 
padding: 1em; 
border: 1em solid transparent; 
background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, red 0, red 12.5%, white 0, white 25%, #58a 0, #58a 37.5%, white 0, white 50%) 0/5em 5em; 
} 

這裏沒有運氣。我猜想使用'addClass'不會以我想象的方式添加類;它可能正在尋找「普通」類，並嘗試將CS​​S應用於它。 '普通'類沒有任何與之相關的CSS。它只是在那裏阻止一些模式的邊界，並且認爲'：not'選擇器會看到添加的類。任何方式來做到這一點？

Answer 1

很可能，您已將Css類應用於錯誤的元素，或者jQuery找不到該元素，這就是爲什麼它沒有添加到它的原因。

檢查jQuery可找到元素

console.log($('.materialize-modal').length); //If 0 then it can't find the element 

如果長度爲0，你可能需要調用的代碼裏面setTimeout(function() {},0); 如果長度爲1和仍存在的問題。

使用chrome開發工具（f12）並檢查模態以檢查班級實際上是否在模態上。

如果類是在模式則是CSS的問題，您也許需要你的CSS更改爲：

.materialize-modal:not(.plain) .modal-dialog { 
    padding: 1em; 
    border: 1em solid transparent; 
    background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, red 0, red 12.5%, white 0, white 25%, #58a 0, #58a 37.5%, white 0, white 50%) 0/5em 5em; 
    }