Skip to main content
se añadieron 105 caracteres en el cuerpo
Origen Enlace
Pablo Lozano
  • 49.9k
  • 8
  • 55
  • 92

#Bienvenido a las rarezas del DOM de HTML.

Esto no es culpa de Javascript, sino de la manera en que se implementa el DOM en los navegadoresen que se implementa el DOM en los navegadores.

##window[name] Returns the indicated element or collection of elements. Returns the indicated element or collection of elements.

As a general rule, relying on this will lead to brittle code. Which IDs end up mapping to this API can vary over time, as new features are added to the Web platform, for example. Instead of this, use document.getElementById() or document.querySelector().

HTML5, de manera no normativa (no recomendada) permite acceder a cualquier elemento que tenga una ID única de la siguiente manera:

window[id];

Por tanto, tú has definido un elemento input así:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">

##¿Qué ha ocurrido?

Al declarar ese elemento, window.activar_reserva pasa a ser un atributo válido que tiene el mismo valor que document.getElementById('activar_reserva'). La función que tú has declarado entra en conflicto con este elemento y ya no es accesible. Cambiando el id o el nombre de la función, todo funciona.

En cualquier caso, te recomiendo usar el método addEventListener para gestionar eventos en los elementos de tu documento.

Comprobación:

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

//aquí es una función
console.log(activar_reserva);
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="console.log('Aquí es un elemento:',activar_reserva);">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

#Bienvenido a las rarezas del DOM de HTML.

Esto no es culpa de Javascript, sino de la manera en que se implementa el DOM en los navegadores.

##window[name] Returns the indicated element or collection of elements.

As a general rule, relying on this will lead to brittle code. Which IDs end up mapping to this API can vary over time, as new features are added to the Web platform, for example. Instead of this, use document.getElementById() or document.querySelector().

HTML5, de manera no normativa (no recomendada) permite acceder a cualquier elemento que tenga una ID única de la siguiente manera:

window[id];

Por tanto, tú has definido un elemento input así:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">

##¿Qué ha ocurrido?

Al declarar ese elemento, window.activar_reserva pasa a ser un atributo válido que tiene el mismo valor que document.getElementById('activar_reserva'). La función que tú has declarado entra en conflicto con este elemento y ya no es accesible. Cambiando el id o el nombre de la función, todo funciona.

En cualquier caso, te recomiendo usar el método addEventListener para gestionar eventos en los elementos de tu documento.

Comprobación:

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

//aquí es una función
console.log(activar_reserva);
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="console.log('Aquí es un elemento:',activar_reserva);">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

#Bienvenido a las rarezas del DOM de HTML.

Esto no es culpa de Javascript, sino de la manera en que se implementa el DOM en los navegadores.

##window[name] Returns the indicated element or collection of elements.

As a general rule, relying on this will lead to brittle code. Which IDs end up mapping to this API can vary over time, as new features are added to the Web platform, for example. Instead of this, use document.getElementById() or document.querySelector().

HTML5, de manera no normativa (no recomendada) permite acceder a cualquier elemento que tenga una ID única de la siguiente manera:

window[id];

Por tanto, tú has definido un elemento input así:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">

##¿Qué ha ocurrido?

Al declarar ese elemento, window.activar_reserva pasa a ser un atributo válido que tiene el mismo valor que document.getElementById('activar_reserva'). La función que tú has declarado entra en conflicto con este elemento y ya no es accesible. Cambiando el id o el nombre de la función, todo funciona.

En cualquier caso, te recomiendo usar el método addEventListener para gestionar eventos en los elementos de tu documento.

Comprobación:

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

//aquí es una función
console.log(activar_reserva);
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="console.log('Aquí es un elemento:',activar_reserva);">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

se añadieron 358 caracteres en el cuerpo
Origen Enlace
Pablo Lozano
  • 49.9k
  • 8
  • 55
  • 92

#Bienvenido a las rarezas del DOM de HTML.

Esto no es culpa de Javascript, sino de la manera en que se implementa el DOM en los navegadores.

##window[name] Returns the indicated element or collection of elements.

As a general rule, relying on this will lead to brittle code. Which IDs end up mapping to this API can vary over time, as new features are added to the Web platform, for example. Instead of this, use document.getElementById() or document.querySelector().

HTML5, de manera no normativa (no recomendada) permite acceder a cualquier elemento que tenga una ID única de la siguiente manera:

window[id];

Por tanto, tú has definido un elemento input así:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">

##¿Qué ha ocurrido?

Al declarar ese elemento, window.activar_reserva pasa a ser un atributo válido que tiene el mismo valor que document.getElementById('activar_reserva'). La función que tú has declarado entra en conflicto con este elemento y ya no es accesible. Cambiando el id o el nombre de la función, todo funciona.

En cualquier caso, te recomiendo usar el método addEventListener para gestionar eventos en los elementos de tu documento.

Comprobación:

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

//aquí es una función
console.log(activar_reserva);
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="console.log('Aquí es un elemento:',activar_reserva);">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

#Bienvenido a las rarezas del DOM de HTML.

Esto no es culpa de Javascript, sino de la manera en que se implementa el DOM en los navegadores. HTML5, de manera no normativa (no recomendada) permite acceder a cualquier elemento que tenga una ID única de la siguiente manera:

window[id];

Por tanto, tú has definido un elemento input así:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">

##¿Qué ha ocurrido?

Al declarar ese elemento, window.activar_reserva pasa a ser un atributo válido que tiene el mismo valor que document.getElementById('activar_reserva'). La función que tú has declarado entra en conflicto con este elemento y ya no es accesible. Cambiando el id o el nombre de la función, todo funciona.

En cualquier caso, te recomiendo usar el método addEventListener para gestionar eventos en los elementos de tu documento.

Comprobación:

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

//aquí es una función
console.log(activar_reserva);
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="console.log('Aquí es un elemento:',activar_reserva);">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

#Bienvenido a las rarezas del DOM de HTML.

Esto no es culpa de Javascript, sino de la manera en que se implementa el DOM en los navegadores.

##window[name] Returns the indicated element or collection of elements.

As a general rule, relying on this will lead to brittle code. Which IDs end up mapping to this API can vary over time, as new features are added to the Web platform, for example. Instead of this, use document.getElementById() or document.querySelector().

HTML5, de manera no normativa (no recomendada) permite acceder a cualquier elemento que tenga una ID única de la siguiente manera:

window[id];

Por tanto, tú has definido un elemento input así:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">

##¿Qué ha ocurrido?

Al declarar ese elemento, window.activar_reserva pasa a ser un atributo válido que tiene el mismo valor que document.getElementById('activar_reserva'). La función que tú has declarado entra en conflicto con este elemento y ya no es accesible. Cambiando el id o el nombre de la función, todo funciona.

En cualquier caso, te recomiendo usar el método addEventListener para gestionar eventos en los elementos de tu documento.

Comprobación:

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

//aquí es una función
console.log(activar_reserva);
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="console.log('Aquí es un elemento:',activar_reserva);">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

Origen Enlace
Pablo Lozano
  • 49.9k
  • 8
  • 55
  • 92

#Bienvenido a las rarezas del DOM de HTML.

Esto no es culpa de Javascript, sino de la manera en que se implementa el DOM en los navegadores. HTML5, de manera no normativa (no recomendada) permite acceder a cualquier elemento que tenga una ID única de la siguiente manera:

window[id];

Por tanto, tú has definido un elemento input así:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">

##¿Qué ha ocurrido?

Al declarar ese elemento, window.activar_reserva pasa a ser un atributo válido que tiene el mismo valor que document.getElementById('activar_reserva'). La función que tú has declarado entra en conflicto con este elemento y ya no es accesible. Cambiando el id o el nombre de la función, todo funciona.

En cualquier caso, te recomiendo usar el método addEventListener para gestionar eventos en los elementos de tu documento.

Comprobación:

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

//aquí es una función
console.log(activar_reserva);
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="console.log('Aquí es un elemento:',activar_reserva);">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>