checkbox habilita text

[camaron2004]

Buen dia. Necesito hacer que un input de tipo text se active al darle click a un checkbox, el input de text debe de estar inavilitado al entrar a la pagina y el checkbox chequeado. Pero lo que he hecho no funciona, pongo el codigo a ver si alguien me puede ayudar a encontrar mi error por favor

Código Javascript:

<script>
function costo(){
if(document.form1.factura.checked){
document.form1.costo.disabled=true;
}
else{
document.form1.costo.disabled=false;
}
}
</script>
 

Código HTML:

<input name="costo" type="text" disabled id="costo" size="3"  /><input type="checkbox" name="factura" checked onChange="javascript:costo()">
 

Espero haber sido claro, muchas gracias por su atencion.

[prueba230683]

Prueba:

Código HTML:

<script>
function costo(){
  if(document.getElementById("costo").disabled){ // si esta deshabilitado
    document.getElementById("costo").disabled = false; // habilitar
  }else{
    document.getElementById("costo").disabled = true; // deshabilitar
  }
}
</script>
 
<input name="costo" type="text" disabled id="costo" size="3"  /><input type="checkbox" name="factura" checked onChange="costo()">
 

Notas:

1) El protocolo javascript: solamente se añade en el atributo href de los enlaces para ejecutar JS, nunca en atributos onclick, onfocus etc.

2) Te recomiendo dejar de usar document.forms y usar siempre document.getElementById, que es la forma más clara de obtener elementos HTML. Así no te confundirás nunca.


Edit:

Siguiendo la lógica de tu código sería más bien así:

Código HTML:

<script>
function costo(){
  if(document.getElementById("micheck").checked){ // si esta marcado
    document.getElementById("costo").disabled = true; // deshabilitar
  }else{
    document.getElementById("costo").disabled = false; // habilitar
  }
}
</script>
 
<input name="costo" type="text" disabled id="costo" size="3"  /><input type="checkbox" id="micheck" name="factura" checked onChange="costo()">
 

Pero ambas formas son válidas.

[ArturoGallegos]

Hoy ando de buenas, te paso un pequeño truco con CSS y otro con JS
https://jsfiddle.net/arturogallegos/c5471vy8/2/

[JSFIDDLE]arturogallegos/c5471vy8/2[/JSFIDDLE]