我在我的文本輸入中添加了一個類，但它不會渲染

Question

我正在使用自動填充來填充文本字段。 如果用戶輸入一些文本，但未從自動填充中選擇，我想突出顯示該文本字段。

所以在下面的jQuery中;

var createAutocomplete = function() { 
    var $input = $(this); 

    var options = { 
     source: $input.attr("data-scd-autocomplete"), 
     select: updateAutocompleteForm, 
     close: errorAutocompleteForm 
    }; 

    $input.autocomplete(options); 
}; 

如果用戶未能從列表中選擇，關閉事件觸發調用此函數;

var errorAutocompleteForm = function(event, ui) { 
     var $input = $(this); 
     $input.removeAttr('class'); 
     $input.attr('class', ''); 
     $input.addClass("input-validation-error"); 
    }; 

因此，我從文本字段中刪除現有類並插入「input-validation-error」類。但是這個類中的CSS沒有顯示出來，而在IE Developer Tools中，它顯示了這個類中的CSS被覆蓋。如何阻止這個CSS被覆蓋？

Answer 1

我發現這個問題 在我的CSS我需要的CSS類的元素類型

input[type="text"].input-validation-error, 
input[type="search"].input-validation-error, 
input[type="password"].input-validation-error { 
    border: solid 1px #e80c4d; 
} 

所以以前input[type="search"].input-validation-error失蹤連接。並且類別

.input-validation-error 
{ 
    border: 1px solid #ff0000; 
    background-color: #ffeeee; 
} 

被忽略。我不得不承認，我不明白爲什麼這個答案是解決方案。所以可以解釋這個的人可以使用。