JSFiddle - React, Tailwind, and code Playground
HTML
<input type="file" id="file_upload" data-width="1200" data-height="1000"/>
JavaScript
var _URL = window.URL || window.webkitURL;
fileInput = $("#file_upload");
var maxWidth = fileInput.data('width');
var maxHeight = fileInput.data('height');
fileInput.change(function(e) {
var file, img;
if ((file = this.files[0])) {
img = new Image();
img.onload = function() {
if (this.width > maxWidth || this.height > maxHeight) {
alert("가로 1200px, 세로 1000px 이하로 첨부 가능합니다. : " + this.width + " x " + this.height);
}
};
img.onerror = function() {
alert( "적절한 이미지 확장자가 아닙니다 : " + file.type);
};
img.src = _URL.createObjectURL(file);
}
});