Quiero cambiar el color de un input
de la siguiente manera:
Имеет к недостаткам ahora sólo lo hace una vez pero lo debería hacer cuantas Лос cambie.
$(document).ready(function() {
$('table :input').blur(function(){
var $input = $(this);
if($input.val() === 'F'){
$input.addClass('rojo');
} else {
$input.addClass('verde');
}
});
});
.rojo {
background: red;
}
.verde {
background: green;
}
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="estilo.css">
</head>
<body>
<table class="tabla">
<tr bgcolor="#085584ff">
<th width="100">Placa</th>
<th><input type="text" value="F"></th>
<th><input type="text" value="1"></th>
</tr>
</table>
</body>
</html>
Никакой se cómo hacer esto, СИ alguien я puede ayudar lo agradecería mucho, además lo logro en el evento blur
y la idea es cuando cambie el input
.
Только ты нуждаешься в том, чтобы использовать событие change
рядом с blur, таким образом:
$(document).ready(function() {
$('table :input').on('blur change', function(){
var $input = $(this);
if($input.val() === 'F'){
$input.addClass('rojo');
} else {
$input.addClass('verde');
}
});
});
Я думаю, что проблема что aГ±aden два класса одновременно, которые меняют то же свойство. Именно поэтому он вновь не меняет цвет, потому что он остается, с которым он aГ±adiГі сначала.
Вместо того, чтобы использовать $input.addClass()
, podrГ-схвати использовать $input.style['background']='red/green'
.
Другая вещь, которую ты можешь делать, состоит в том, чтобы уверять, что, если он стоит 'F', у неудара в лунку нет 'зеленого' класса и, когда он будет стоить '1', у неудара в лунку нет класса 'красный', с $input.classList.remove('verde/rojo')
соответственно.