input type ="file"で読み込んだ画像ファイルの大きさ（ピクセル）を取得する

もともと,input でファイルを読み取れるようにしてはいたが、あまりにも大きい画像の場合はリサイズをしてもらうように決まったので、アップロードする前に画像の大きさを取得し縦、横それぞれ１０００ピクセル超えたらアラートがなるようにした。
HTML

<input type="file" id="test" >

javascript

$(test).change(function(){
var reader = new FileReader();
var img = new image();
reader.onload = function(){
img.src = reader.result;
img.onload  = function(){
if(img.width >=1000 && img.height >=1000){
//成功
}else{
alert("画像が１０００ピクセル以上です");
}
}
}
reader.readAsDataURL($(this).prop("files")[0]);
})

ここで、僕は今までの処理をreader.onloadの外側に書いていたので、何とかimg.widthとimg.heightを外にだ外試みましたが結果はできず、今回の例だと$(test).changeの中を全部通ってからonloadイベントにいきました。

ちなみに、FileReaderコンストラクトにはonloadより早く読み込めるDOMContentLoadedというものもあったのですが、imgの方ではつかえないようで、FileReaderでは使えたのですが、imgではつかえなかったです、（もしかしたら僕の使い方がまちがっていたのかもしれませんが。）

DOMContentLoadedで書いた場合

$(test).change(function(){
var reader = new FileReader();
var img = new image();
window.addEventListener("DOMContentLoaded",function(){
img.src = reader.result;
img.onload  = function(){
if(img.width >=1000 && img.height >=1000){
//成功
}else{
alert("画像が１０００ピクセル以上です");
}
}
}
})
reader.readAsDataURL($(this).prop("files")[0]);
})
<||