jQuery sprawdzania poprawności koloru tła elementu

Question

jQuery.validate domyślnie nie zmienia koloru tła nieprawidłowego elementu. Czy jest również możliwa zmiana koloru tła elementu select? Większość moich elementów to input type="text", ale potrzebuję wskaźnika dla wybranych elementów formularza. Jestem nie używając domyślnie wygenerowanych wiadomości, ponieważ nie pasują one do mojego układu.

Poniższy kod robi zmienić kolor tła z input elementów, ale to nigdy nie powróci do swojego poprzedniego stylu:

 
$('form[name="register"]').validate({ 
     errorClass: 'jqInvalid', 
     rules: { 
      fnameCreate: "required", //input 
      monthCreate: "required", //select 
      emailCreate: { required: true, email: true }, //input 
      passwordCreate: "required", //input type=password 
     }, 
     messages: { 
      fnameCreate: "", 
      monthCreate: "", 
      emailCreate: "", 
      passwordCreate: "", 
     }, 
     errorPlacement: function (error, element) { 
      element.css('background', '#ffdddd'); 
     } 
    }); 

Edit (próbka)

<div class="field"> 
    <div class="labelName_fb"> 
    <label for="email">Email</label> 
    </div> 
    <div class="divforText3"> 
    <div class="divLeft"></div> 
    <div class="textbox-image3"> 
     <input class="txt required" id="emailCreate" name="emailCreate" value="" maxlength="100" type="text" style='width:180px'> 
    </div> 
    <div class="divright"></div> 
    </div> 
</div> 

Gdzie input element otrzymuje klasę błędu jqInvalid w przypadku błędu.

CSS

/* line 3 */ .error { background: #ffdddd; } /* I have since removed the errorClass option */ 
/* line 254 */ .field .txt {background:transparent none repeat scroll 0 0;border:medium none;color:#000;font-size:11px;width:130px; margin:5px 0;} 

Answer 1

Nieprawidłowe elementy uzyskać klasę errorby default, lub w przypadku jqInvalid odkąd ustawić opcję errorClass, tylko styl, klasę, jak chcesz w arkuszu stylów, na przykład:

.jqInvalid { background: #ffdddd; } 

Można zastąpić specyfiki dla komunikatów o błędach (element domyślny jest <label>), jeśli chcesz:

label.jqInvalid { background: none; } 

podejście to CSS dba o usunięciu ... ponieważ klasa jest usuwana raz to ważne. Istnieje również klasa success, jeśli chcesz zastosować zielone tło do poprawnych elementów itp.

Answer 2

To był problem specyficzności. .error i .jqInvalid są zarówno mniej szczegółowe niż .field .txt

So, zwiększając wymaga specyfika zmianę CSS .field input.error, który ma większą wagę niż .field .txt więc kolejność nie liczyło.

Zobacz here Informacje na specyfikę