用DOM对象在js内判断图片大小

<input type="file" id="myFile1" onpropertychange="test()">
<script>
function test(){
var file=document.getElementById("myFile1");
if (checkExd(file.value))checkSize(file.value)
}
function checkSize(fileName){
var img=new Image();
img.onerror = new Function("alert('文件不存在，或目标类型不匹配！');");
img.onreadystatechange = function (){if (img.readyState == "complete"){
if(img.fileSize>2*1024*1024)alert("文件超过2M");}}
img.src=fileName;
}
function checkExd(fileName){
if(fileName.lastIndexOf(".")+1>=fileName.length){
 alert("文件类型不匹配");
 return false;
 }
var exd=fileName.substring(fileName.lastIndexOf(".")+1).toUpperCase();
if(exd=="GIF"||exd=="JPG") 
 return true;
else {
 alert("文件类型不匹配");
 return false;
 }
}

</script>

 

原文实例：

限制：<input type="text" size="4" value="10" name="fileSizeLimit" id="fileSizeLimit"/> K
<input type="file" name="file1" id="file1" size="40" οnchange="changeSrc(this)"/>
<img src="about:blank" id="fileChecker" alt="test"  height="18"/>

<script type="text/javascript">
var oFileChecker = document.getElementById("fileChecker");

function changeSrc(filePicker)
{
    oFileChecker.src = filePicker.value;
}

oFileChecker.onreadystatechange = function ()
{
    if (oFileChecker.readyState == "complete")
    {
        checkSize();
    }
}

function checkSize()
{
    var limit  = document.getElementById("fileSizeLimit").value * 1024;

    if (oFileChecker.fileSize > limit)
    {
        alert("too large");
    }
    else
    {
        alert("ok");
    }
}
</script> 

实例二

<img src="1143484642303.gif" id="monkey" alt="monkey" /> loops: <span id="loopsNum"></span>

<script type="text/javascript">
var loops = 0;
document.getElementById("monkey").onload = function ()
{
    document.getElementById("loopsNum").innerText= loops;
    loops ++;
}
</script> 

 

判断图片大小：

<script language="JavaScript">
  function check(url){
    var Img=new Image();
    var file1=document.all("file1");
    Img.onload = new Function("if(this.width>500 || this.height>400){alert('文件宽高不匹配！');file1.outerHTML=file1.outerHTML;}else{document.all('browPic').src=file1.value;}");
    Img.onerror = new Function("alert('文件不存在，或目标类型不匹配！');file1.outerHTML=file1.outerHTML;");
    Img.src = url;
}
</script>
<input name="file1" type="file" onpropertychange="check(this.value)"><br>
<img name="browPic" src="" alt="还未选择图片，选择后方可预览！">