1

tengo un botón con un select que, dependiendo la elección que se elija quiero que descargue un elemento u otro. Os enseño el código html y js, pero es que ni siquiera me entra a el código, ya que no me tira el alert, tengo el código script en el head y también lo probe antes de terminar el body.

HTML:

<div class="prod-descarga" id="prod-descarga"><a href="X">DESCARGAR</a></div>
                    <select id="descargas-prod">
                        <option value="Windows" selected="selected">Windows</option>
                        <option value="Mac">Mac</option>
                    </select>
                </div>

JS:

$(document).ready(function(){
$('#prod-descarga').on('change', '#descargas-prod',function(){

        var selected= $('#descargas-prod option:selected');
        var value= selected.val();
        var descarga='<a href="Y">DESCARGAR</a>';

        if(value=="Mac"){
            $('#prod-descarga').innerHTML = descarga;
        }else alert('Joder');
    });
});
5
  • ¿Probaste abrir la consola del navegador para ver si lanza por ahí algún mensaje de error?
    – user128299
    el 27 mar. 2020 a las 15:19
  • No manda ninguno el 27 mar. 2020 a las 15:20
  • Para poder ayudar mejor ¿serías tan amable de recactar mas a detalle lo que tratas de conseguir con tu código?
    – user128299
    el 27 mar. 2020 a las 15:21
  • Claro, hay una descarga por defecto en el div, esa descarga es para windows, si por ejemplo el usuario cambia el select a 'MAC' quiero que se cambie el enlace de descarga por un archivo que solo vale para MAC el 27 mar. 2020 a las 15:23
  • Creo haberte entendido bien, espero la respuesta te ayude
    – user128299
    el 27 mar. 2020 a las 15:45

2 respuestas 2

1

Lo puedes intentar de esta forma:

Basado en un ejemplo hecho con puro JS (ya que colocaste dicha etiqueta)

  • Captura en 2 variables tanto el select como el enlace a
  • A la variable que capturó el select agregale un listener en el evento change
  • Por dentro de la función capturamos el text del option que clickeo el usuario
  • Con el uso de un condicional verificamos si el text de esa opción es Mac
  • En caso de que la condición anterior se cumpla entonces modificamos el attribute del enlace con el método setAttribute indicando que ahora valdrá Y (claramente en lugar de Y tu le pones el enlace para la descarga relacionada a Mac)

EJEMPLO

    <div class="prod-descarga" id="prod-descarga"><a href="X">DESCARGAR</a></div>
      <select id="descargas-prod">
        <option value="Windows" selected="selected">Windows</option>
        <option value="Mac">Mac</option>
      </select>
    </div>
    
    <script>
    let opcionSeleccionada = document.getElementById("descargas-prod")
    let descarga = document.querySelector("div a")
    
    opcionSeleccionada.addEventListener("change", () => {
      let opcion = opcionSeleccionada.options[opcionSeleccionada.selectedIndex].text
      if(opcion === "Mac") {
        descarga.setAttribute("href", "Y")
        console.log(descarga.getAttribute("href"))
      }
    })
    </script>

2
  • Te comento, he partido del código JS que me has proporcionado (me equivoqué, me refería a jquery, perdón), y tu código lo que hace es que me pone de atributo el href, no me cambia la descarga ni el archivo, pero lo he arreglado con el innerHTML. Muchas gracias BetaM, has sido de gran ayuda, dejo el código cambiado. el 27 mar. 2020 a las 16:06
  • Perfecto que bueno te sirvió de partida y no olvides que cuando el sistema lo permita la marques como aceptada @JesusSanchez
    – user128299
    el 27 mar. 2020 a las 16:08
1

Este es el código un pelín modificado al proporcionado por BetaM al que le quiero agradecer su ayuda.

$(document).ready(function(){
    let opcionSeleccionada = document.getElementById("descargas-prod")
    let descarga = document.querySelector("div.prod-descarga") /* Estaba cogiendo otro a, normal ya que solo vistes una parte del trozo */

    opcionSeleccionada.addEventListener("change", () => {
      let opcion = opcionSeleccionada.options[opcionSeleccionada.selectedIndex].text
      if(opcion === "Mac") {
        descarga.innerHTML = '<a href="Y">DESCARGAR</a>';  /*Me quita el otro a si seleccionan MAC y me introduce el que quiero*/
      }
    })
});

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.