Добавить класс к label, когда его input заполнен.
<input type="text" id="test1">
<label for="test1">поле 1</label>
Как это можно реализовать на jquery?
$('#test1').change(function(){
tmpval = $(this).val();
if(tmpval == '') {
$('#lbl1').removeClass('class1');
} else {
$('#lbl1').addClass('class1');
}
});
.class1 {
background: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test1">
<label id="lbl1" for="test1">поле 1</label>
В моем решении также событие срабатывает при вставке текста и без необходимости выходить из фокуса поля, чтобы сработали изменения.
$('#test1').on('change paste keyup', function () {
var $this = $(this);
var input_value = $this.val();
var input_id = $this.attr('id');
if (input_value.length === 0) {
$('label[for=' + input_id + ']').removeClass('foo');
} else {
$('label[for=' + input_id + ']').addClass('foo');
}
});
.foo {
background-color: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test1">
<label for="test1">поле 1</label>
На чистом JS:
document.getElementById('test1').onkeyup = function() {
if(this.value == '') {
document.getElementById('lbl1').classList.remove('class1');
}else{
document.getElementById('lbl1').classList.add('class1');
}
};
.class1 {
background: green;
}
<input type="text" id="test1">
<label id="lbl1" for="test1">поле 1</label>
Виртуальный выделенный сервер (VDS) становится отличным выбором
Доброй ночи! Пытаюсь разобраться как работает jQuery но не могу его нормально настроить на jsp страницеНа странице html код работает нормально
Здравствуйте! Помогите пожалуйста разобраться в вопросе: Беру json данные из внешнего файла и пытаюсь вставить в предназначенные для них элементыНо...
Необходимо в объект записать свойства двух других объектов, но при этом одинаковые свойства не заменять, а складывать значения ключейПример: