1

Buenas tengo un problema con un evento en mi formulario lo que hace mi evento es que al apretar un boton carga una imagen en mi pagina lo cual sucede pero no entiendo por que se deshacer al instante eso como que carga la imagen al instante que aprieto el boton y al instante tambien se deshacer. Este seria el codigo del evento.

var cent=document.getElementById("dentro");

var subir=document.querySelector("#subir");

subir.addEventListener("submit",function(){

    var imagen=document.getElementById("foto").value;


    console.log(imagen);
    var cuadrado=document.createElement("div");

    var imagCua=document.createElement("img");
    imagCua.width=150;
    imagCua.src=imagen;

    cent.appendChild(imagCua);
})
4
  • 3
    Se recarga la página?
    – user128299
    Commented el 6 feb. 2020 a las 14:04
  • 6
    debes agregarle el event.preventDefault(); para evitar el comportamiento por defecto del formulario ejemplo: subir.addEventListener("submit",function(e){ e.preventDefault(); //resto del codigo
    – Bryro
    Commented el 6 feb. 2020 a las 14:09
  • 2
    @Bryro iba a responder eso hasta que leí tu comentario, ponlo como respuesta.
    – Vlady
    Commented el 6 feb. 2020 a las 14:12
  • 2
    @vlady no te preocupes responde es que de momento ando desde el cel y es un poco dificil responder asi! saludos
    – Bryro
    Commented el 6 feb. 2020 a las 14:34

2 respuestas 2

0

Debes de cancelar evento por defecto del formulario, ya que al acabar el tuyo el formulario se envía y por ende se te recarga la página.

Prueba con esto:

subir.addEventListener("submit",function(e){

    var imagen=document.getElementById("foto").value;

    console.log(imagen);
    var cuadrado=document.createElement("div");

    var imagCua=document.createElement("img");
    imagCua.width=150;
    imagCua.src=imagen;

    cent.appendChild(imagCua);

    e.preventDefault();

})
0

con even.preventDefault evitas la propagacion del evento dentro del DOM y por tanto en este caso el submit a tu servidor.

aqui tu codigo modificado:

var cent=document.getElementById("dentro");

var subir=document.querySelector("#subir");

subir.addEventListener("submit",function(event){

     event.preventDefault();//con esto evitas el submit
    var imagen=document.getElementById("foto").value;


    console.log(imagen);
    var cuadrado=document.createElement("div");

    var imagCua=document.createElement("img");
    imagCua.width=150;
    imagCua.src=imagen;

    cent.appendChild(imagCua);
})

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.