上传图片前获取其尺寸

上传图片前有时需要判断用户提交的图片是否符合一定的尺寸规格，通常的解决办法是先将图片传送到后台，然后再判断，但这样增加了开支，提高了消耗，安全性也不高。因此最好能够在前端就能进行简单的判断，但是由于浏览器兼容性的问题，往往做起来非常麻烦。ie还好，因为本身就可以通过new Image()的方式直接获得尺寸，而chrome等高级点浏览器就不那么直接了，不过好在有了html5的支持，里面提供了FileReader()这个接口，可以方便地读取文件内容和信息。

$('#fileInput').change(function(e) {
        if(typeof FileReader != 'undefined') {
            readImage(this, showImage);
        } else {
            showImage(this.value);
        }
    });
    function showImage(src) {
        var img = new Image();
        img.onload = function() {
            document.body.appendChild(img);
            alert([this.width, this.height].join(','));
        }
        img.src = src;
    }
    function readImage(that, callback){
        var file = that.files[0];
19         if(!/image\/\w+/.test(file.type)){
            alert("请确保文件为图像类型");
            return false;
        }
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function(e){
            if(callback) callback.call(this, this.result);
        }
    }