Why Does My Check Image Dimension Function Not Work With Onchange Dom Javascript?

I want to alert width and height of image using javascript but not word how can i do ? https://jsfiddle.net/5ajak14c/ this.value to the function, so image_dimension is the value of the input, not the input itself.

If you use a proper event listener, it's easier

document.getElementById('banner_img_ads').addEventListener('change', function() {
  var file = this.files[0], img;

  if (file) {
    img = newImage();
    img.onload = function() {
      alert(this.width + " " + this.height);
    };
    img.onerror = function() {
      alert("not a valid file: " + file.type);
    };
    img.src = URL.createObjectURL(file);
  }
});

<inputname="banner_img_ads"id="banner_img_ads"type="file" />

Solution 2:

Here's my solution. Hope it helps!

functionreadURL(input) {
        if (input.files && input.files[0]) {
            var reader = newFileReader();
            
            reader.onload = function (e) {
                $('#blah').attr('src', e.target.result);
                alert($('#blah').width() + " " + $('#blah').height());
            }
            reader.readAsDataURL(input.files[0]);
        }
    }
    
functionmyFunction(input) {
    readURL(input);
}

<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script><inputtype='file'id="imgInp"onChange = "myFunction(this)"/><imgid="blah"src="#"style = "display:none;"/>