0

En el programa, yo le doy a elegir al usuario entre 2 opciones, de las cuales debe seleccionar 1, y luego en base a eso, el boton continuar, lo llevara a una URL u otra URL. Fijense que en el button, deje 2 links . No se como hacer el codigo en javascript. Por favor, ayuda.

introducir el código aquí

   <section class="main"> 
    <h2 class="pregunta">¿Que sector necesitas cubrir?</h2>
   <div class="contenedor-bi-1">
  <div class="cuadro-1">
    
    <h3>Pared/Division</h3>
      
      <label>
        Seleccionar
          <input type="checkbox" name="opcionBifurcacion" id="pared" value="Pared" 
    onclick="isChecked()">
      </label>
      <img src="../essets/img/bifurcacion-1-pared.jpg" alt="#">
   </div>
      <div class="cuadro-2">
        
        <h3>Techo/Cielorraso</h3>
          <label>
            Seleccionar
              <input type="checkbox" name="opcionBifurcacion" id="techo" value="Techo" 
   onclick="isChecked()"> 
          </label>
          <img src="../essets/img/bifurcacion-1-techo.jpg" alt="#">
      </div>
  </div>
  <div class="boton" id="continue">
    <button class="continuar">Continuar</button>
    <a id="a1" class="link" href="seleccion-material-pared.html"></a>
    <a id="a2" class="link" href="seleccion-material-techo.html"></a>
  </div>
  </section>
3
  • Mmmmm... ¿Cómo redirigir a otra página web?
    – padaleiana
    el 25 mar. a las 14:08
  • Si, pero en base a lo que el usuario elija, vaya a una pagina u otra. Se entiende? si el elije la opcion A, va a una pagina en particular, si elije opcion B, va a otra pagina el 25 mar. a las 14:51
  • Entonces sí responde a la pregunta :)
    – padaleiana
    el 25 mar. a las 23:12

1 respuesta 1

0

Asi como tienes el código el usuario puede chequear los dos por el tipo de input que escogiste, debes usar radiobutton, esto hace que solo pueda escoger uno de los dos, por otro lado, la acción en JavaScript debe estar enfocada en el Button no en los inputs asi que debes sacar la función onclick de los mismos.

Aquí el código planteado:

<section class="main"> 
  <h2 class="pregunta">¿Qué sector necesitas cubrir?</h2>
  <div class="contenedor-bi-1">
    <div class="cuadro-1">
      <h3>Pared/División</h3>
      <label>
        <input type="radio" name="opcionBifurcacion" value="Pared"> 
        Seleccionar
      </label>
      <img src="../essets/img/bifurcacion-1-pared.jpg" alt="#">
    </div>
    <div class="cuadro-2">
      <h3>Techo/Cielorraso</h3>
      <label>
        <input type="radio" name="opcionBifurcacion" value="Techo"> 
        Seleccionar
      </label>
      <img src="../essets/img/bifurcacion-1-techo.jpg" alt="#">
    </div>
  </div>
  <div class="boton" id="continue">
    <button class="continuar" onclick="redirect()">Continuar</button>
  </div>
</section>

  <script>
  function redirect() {
  var opcion = document.querySelector('input[name="opcionBifurcacion"]:checked');
  if (opcion === null || opcion === undefined) {
    alert("Por favor, seleccione una opción.");
    return;
  }
  opcion = opcion.value;
  if (opcion === "Pared") {
    window.location.href = "seleccion-material-pared.html";
  } else if (opcion === "Techo") {
    window.location.href = "seleccion-material-techo.html";
  } 
}
  </script>


1
  • 1
    Era lo que necesitaba. Problema solucionado. Muchas gracias!! Sos un groso el 25 mar. a las 19:06

Tu Respuesta

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

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