1

Tengo el siguiente código para desbloquear un botón , pero no funciona, Cual es el error?, que significa que el error solo me aparezca en la consola de google chrome y no en los errores por ejemplo de liveweave.com?

ERROR:

uParty is not a function at HTMLInputElement.onclick

<!DOCTYPE html>
<html>

<head>
  <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>

<body>
  <input id="partyCode" placeholder="Party code" type="text" disabled>
  <input onclick="uParty()" type="button" id="uParty" value="Unirse a party">
  <script>
    $(document).ready(function() {
      function uParty() {
        document.getElementById('partyCode').disabled = false;
      }
    });
  </script>

</body>

</html>

7
  • Dependiendo el navegador que uses, deberias usar la consola javascript para ver los errores. Si no, estás a ciegas. En Chrome, por ejemplo, con Ctrl-Shift-J. ASí verías que te falta cerrar la llave de la primer línea.
    – leonbloy
    el 10 may. 2017 a las 3:32
  • Eso no afecta,,
    – ESCM
    el 10 may. 2017 a las 3:36
  • Sí que "afecta". Es un error. Que no alcance a solucionar el problema, es porque tienes otro error. Mira la consola.
    – leonbloy
    el 10 may. 2017 a las 3:37
  • Si es un error, pero no afecta la funcionalidad, me refiero a que ese no es el error principal y la consola por ejemplo de liveweave, no me da ningún error.
    – ESCM
    el 10 may. 2017 a las 3:39
  • Es mucho trabajo copiar ese codigo html a un archivo y abrirlo en Chrome? es lo que deberías estar haciendo todo el tiempo si estás programando en Javascript.
    – leonbloy
    el 10 may. 2017 a las 3:40

3 respuestas 3

2

No se entiende si quieres usar Jquery o Javascript "pelado"; estás mezclando las dos alternativas.

En Javascript "pelado" sería:

function habilitar() {
          document.getElementById('partyCode').disabled = false;
}
<input id="partyCode" placeholder="Party code" type="text" disabled>
<input type="button" id="uParty" value="Unirse a party" onclick="habilitar()">

Con Jquery sería así:

$("#uParty").click( function() {
   $("#partyCode").prop('disabled', false);
 }
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<input id="partyCode" placeholder="Party code" type="text" disabled>
<input type="button" id="uParty" value="Unirse a party" >

Desde ya, es importante que entiendas qué ocurre en cada caso...

Por cierto, tu código original simplemente anda si sacas la funcion fuera de todo ese bloque de inicializacion jquery

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input id="partyCode" placeholder="Party code" type="text" disabled>
<input onclick="uParty()" type="button" id="uParty" value="Unirse a party">
<script>
 function uParty() {
            document.getElementById('partyCode').disabled = false;
        }

</script>

</body>
</html>

Tu codigo original, lo que estaba haciendo era, al momento de estar ready la página, correr una cierta función (anónima) la cual sólo declaraba una función uParty (y recuerda que declarar una función en Javascript es como instanciar un objeto). Pero esa función uParty se declaraba/instanciaba como un objeto local de la función anónima (y no se invocaba ni se asignaba ni nada), por lo que al terminarse de ejecutar la función anónima, no quedaban rastros de uParty. Tú en cambio querías que uParty quedara disponible en el entorno global (que en Javascript hosteado en página web corresponde al objeto window). Por lo tanto, podrías si quieres hacer esto:

$(document).ready(function(){
        window.uParty =  function () {
            document.getElementById('partyCode').disabled = false;
      }
   });

Pero sería algo retorcido, y nada necesario.

2
  • Losé el problema es que me da el error: uParty is not a function at HTMLInputElement.onclick , por eso creí agregarle el document.ready para que funcionase apenas se carga
    – ESCM
    el 10 may. 2017 a las 3:58
  • Mi problema es que la función está dentro de un IIFE
    – ESCM
    el 10 may. 2017 a las 4:26
1

Les comparto un código que me pasaron muy bueno ya lo probe y si habilita y desabilita un input

cuando nfactura es mi input y caja es mi combox

<script >

//con esta funcion haces que el combox habilite un text

var input = document.getElementById('nfactura');

function carg(elemento) {
  d = caja.value;

  if(d == "cf"){
    nfactura.disabled = false;

  }else{
    nfactura.disabled = true;
  }
}
</script>

en el combox

  <select id="caja" name="caja" onchange="carg(this);" >
      <option value="*">selecciona los datos</option>
      <option value="sf" >sin factura</option>
      <option value="cf" >con factura</option>
</select>
0

Cambié varias cosas:

  • Puse la etiqueta <script></script> en <head></head>.

  • Quité la función uParty de $(document).ready(function(){}, quedando suelta.

  • La función getElementById, en mi opinión, no sirve de nada, ya que se puede llamar directamente.

<!DOCTYPE html>
<html>
  <head>
  <script>
  function uParty() {
    partyCode.disabled=false
  }
  </script>
  </head>
  <body>
    <input id="partyCode" placeholder="Party code" type="text" disabled>
    <input onclick="uParty()" type="button" id="uParty" value="Unirse a party">
  </body>
</html>

2
  • 1
    Lo de omitir getElementById aprovechando que los elementos con id se ven como atributos del objeto window funciona pero es fuertemente desaconsejado
    – leonbloy
    el 10 may. 2017 a las 14:38
  • @leonbloy Es interesante, no sabía. Solo hay que tener cuidado que no choquen los nombres entre el id y una variable global.
    – user13558
    el 11 may. 2017 a las 23:31

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.