Validar imágen con js

[alvaro_trewhela]

Estimados, mi consulta es sencilla, se puede obtener el alto y ancho de una imagen de un input file con js

Eso, Saludos.

[Alexis88]

Utiliza el constructor Image y el método .createObjectURL() de la interface URL. Con el primero crearás un nuevo elemento HTMLImageElement, mientras que con el segundo obtendrás la ruta del archivo subido, pudiendo así asignarlo al elemento de imagen, mismo que posee las propiedades width y height.

Código Javascript:

document.querySelector("#id del <input>").addEventListener("change", function(){
    var file = this.files[0], image = new Image();
    image.src = URL.createObjectURL(file);
    image.addEventListener("load", function(){
        console.log("Ancho: " + this.width + "px");
        console.log("Alto: " + this.height + "px");
    }, false);
}, false);
 

El script se ejecutará cuando se produzca el evento change en el <input>, es decir, cuando se haya elegido el archivo.

DEMO

Un saludo

[alvaro_trewhela]

muchisimas gracias !!!