Cambio en el código para que se muestre gráficamente
<script type="text/javascript">
//console.log(document.getElementsByName("fecha1"));
function cambio (input) {
var inputs = document.getElementsByTagName("input");
console.log(input.value);
var inputInt;
for (var i = 0; i < inputs.length; i++) {
if (inputs[i] == input) {
inputInt = i;
}
}
if (inputInt > 0) {
if (inputs[inputInt -1].value > input.value) {
input.style.background= "red";
} else {
input.style.background= "green";
}
} else {
input.style.background= "green";
}
}
</script>
Todos los input
deben ir de esta forma.
<table>
<tr>
<td>
<input type="date" name="fecha1" value="2000-05-05" onkeyup="cambio(this)" onclick="cambio(this)">
</td>
</tr>
<tr>
<td>
<input type="date" name="fecha2" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td>
</tr>
<tr>
<td>
<input type="date" name="fecha3" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td>
</tr>
<tr>
<td>
<input type="date" name="fecha4" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td>
</tr>
</table>
Una vez que veas que funcionó cambia los valores de los input
por los tuyos.
Nota: si tienes mas
input
habría que hacer una validación para que solo te tome esos 4, ya que en la funciónJavaScript
revisa todos losinputs
.