El código es enorme, son 4 o 5 páginas solo el html, por lo que he obtado por mostraros la parte "importante"
<
input type="text" size="3" maxlength="3" id="km" name="km" value="{$km}" onkeypress="return poblacionsProperesEvent(event)" />
<
input type="button" id="recalcularPueblos" value="Recalcular pueblos próximos" onclick="testKmError()" />
<div class="footer_no_border">
<div style="float:left">
<input type="checkbox" id="distancia" name="distancia"
onchange="disable_km()" />
El trabajillo
es a distancia, quiero que salga en todas las poblaciones
...
El elemento input con id "distancia" es el que carga la función disable_km (en rojo). La función disable_km la tienes entera a continuación.
La funcion disable_km desactivará muchos inputs, dos de ellos son los que aparecen arriba en azul.
El tema es que en FF no hay ningun problema, però en IE (6 y 7) cuando desactivo los botones (mediante la funcion disable_km() ) tengo que hacer click a algun lado de la pantalla del navegador porque se vea el efecto del nuevo estilo. No hay un problema funcional (porque no se puede pulsar ningún botón que está desactivado), es simplemente que el estilo para los botones desactivados no se "redibuja" en IE. Lo mismo pasa cuando pongo los botones "activos" otra vez.
aquí va la función disable km, que es la que desactiva los botones y les cambia el estilo:
function disable_km()
{
if(document.getElementById("distancia").checked==t rue)
{
document.getElementById("km").disabled=true;
document.getElementById('recalcularPueblos').disab led=true;
pintaBotoDisabled('recalcularPueblos');
pintaBotoDisabled('km');
...
}
else
{
document.getElementById("km").disabled=false;
document.getElementById('recalcularPueblos').disab led=false;
pintaBotoEnabled('recalcularPueblos');
pintaBotoEnabled('km');
...
}
}
function
pintaBotoEnabled(id)
{
elem=document.getElementById(id);
elem.style.color="#FFFFFF";
elem.style.backgroundColor="#6699CC";
elem.style.border="#000099 solid 1px";
}
function
pintaBotoDisabled(id)
{
elem=document.getElementById(id);
elem.style.backgroundColor="#d1e5f9";
elem.style.color="#7676f2";
elem.style.border="#7676f2 solid 1px";
}
ademas en las css tengo:
input:disabled{
color: #7676f2;
background-color: #d1e5f9;
border: #7676f2 solid 1px;
}
input , button{
font-family: Tahoma, Verdana, Arial;
font-size: 14px;
color: #FFFFFF;
background-color: #6699CC;
border: #000099 solid 1px;
}