javascript - 上传前检查图像尺寸/大小

Question

如何使用此功能检查图像的尺寸？我只是想在上传之前检查一下...

$("#LINK_UPLOAD_PHOTO").submit(function () {
    var form = $(this);
    form.ajaxSubmit({
        url: SITE_URL + 'functions/_app/execute/link_upload_photo.php',
        dataType: 'html',
        beforeSubmit: function () {
    //CHECK DE IMAGE DIMENSIONS, SIZE, AND SHOW ERRORS
        },
        uploadProgress: function (event, position, total, complete) {
            $(".j_progressbar").fadeIn();
            $(".j_progressbar .bar").width(complete + "%");
        },
        success: function (data) {
            $("#PHOTO_UPLOADED").css("background-image","url("+window.URL.createObjectURL(document.getElementById('ADD_FIGURE').files[0])+")");
            $("#PHOTO_UPLOADED").css("background-size","462px");
            $("#UPLOAD_STATUS").css("opacity", "0.5");
            $("#UPLOAD_STATUS").css("-moz-opacity", "0.5");
            $("#UPLOAD_STATUS").css("filter", "alpha(opacity=50)");
            $(".j_progressbar").hide();
            $(".ADD_FIGURE").attr("rel",data);
        }
    });
    return false;
});

谢谢你所做的一切。

Answer 1

引用the docs用于使用 HTMLImageElement 的 .naturalWidth 和 .naturalWidth 只读属性。

var x = document.getElementById("myImg").naturalWidth;

function myFunc() {
  var x = document.getElementById("myImg").naturalWidth;
  var y = document.getElementById("myImg").naturalHeight;
  alert(x + "X" + y);
}

<img id="myImg" src="http://www.w3schools.com/jsref/compman.gif" style="width:500px;height:98px;">
<button onclick=myFunc()>GET DETAILS</button>