jQuery проверить изменение цвета фона элемента

jQuery.validate, похоже, по умолчанию не изменяет цвет фона недействительного элемента. Можно ли также изменить цвет фона элемента select? Большинство моих элементов - input type="text", но мне нужен индикатор для элементов формы выбора. Я не, используя созданные по умолчанию сообщения, так как они не соответствуют моему расположению.jQuery проверить изменение цвета фона элемента

Следующий код делает изменить цвет фона input элементов, но он никогда не вернется к своему предыдущему стилю:

 
$('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'); 
     } 
    });

Редактировать (образец)

<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>

Где Элемент input присваивается класс ошибок jqInvalid при ошибке.

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;}

CSS screenshot in Chrome

источник

2010-09-24 David Fox

Недействительные элементы получают класс errorby default, или в вашем случае jqInvalid, так как вы установите опцию errorClass, просто стиль этот класс, как вы хотите в таблице стилей, например:

.jqInvalid { background: #ffdddd; }

Вы можете переопределить особенности для сообщений об ошибках (элемент по умолчанию является <label>), если вы хотите:

label.jqInvalid { background: none; }

Этот CSS подход заботится о снятии ... так как класс удаляется, как только она действует. Также есть класс success, если вы хотите использовать зеленый фон для действительных элементов и т. Д.

источник

2010-09-24 21:36:18

я удалил варианты errorClass и errorPlacement, и я замечаю '.error' класс добавляется к элементам. Но мой CSS не отменяет. В Firebug CSS есть (ниже активного CSS), но он вычеркнут. –

@David - Должен быть какой-то другой стиль с теми же свойствами, что и его переопределение ... что-то более конкретное, какое правило действительно имеет эффект, с тем же свойством, которое вычеркнуто для вашего класса '.error'? –

Это правило класса '.field .txt', где' .field' - это div-обтекание окна, а '.txt' - прямое применение. Я думал, что будут применены стили .txt и .jqInvalid (или ошибки), если атрибут класса является 'class =" txt jqInvalid "' ?? –

Это была проблема специфики. .error и .jqInvalid являются менее специфичен, чем .field .txt

Так, увеличение специфичности требуется изменение CSS для .field input.error, который имеет больший вес, чем .field .txt поэтому порядок больше не имело значения.

См here для получения информации о специфике

источник

2010-09-27 19:07:26

jQuery проверить изменение цвета фона элемента

ответ

Смежные вопросы