html选择文件夹控件,File文件控件，选中文件(图片,flash,视频)即立即预览显示

我们平常用file文件控件上传文件，要预览有时会刷新页面，结果file控件被清空，好多人问能能让他不清空或重新赋值，因为处于安全性的考虑，这是不可能的。那怎么进行无刷新预览呢？这里我把我所使用的方法写一下。

选择页面：

function checkData()

{

var fileName=document.getElementById("FileUp").value;

if(fileName=="")

return;

//检查文件类型

var exName=fileName.substr(fileName.lastIndexOf(".")+1).toUpperCase()

if(exName=="JPG"||exName=="BMP"||exName=="GIF")

{

//document.getElementById("myimg").src=fileName;

document.getElementById("previewImage").innerHTML='';

}

else

if(exName=="SWF")

{

document.getElementById("previewImage").innerHTML='';

}

else

if(exName=="WMV"||exName=="MPEG"||exName=="ASF"||exName=="AVI")

{

var strcode='

strcode+=' autoStart=\'1\' playCount=\'0\' enableContextMenu=\'0\' type=\'application/x-mplayer2\'>

';

document.getElementById("previewImage").innerHTML=strcode;

}

else

{

alert("请选择正确的图片文件");

document.getElementById("FileUp").value="";

}

}

function openwin()

{

window.open("addPreview.aspx","","height=300,width=345,top=100,left=100");

}

HTML代码：

runat="server" onchange="checkData()"> 注：这里可以是图片(jpg或gif格式),flash动画(swf)及视频文件(wmv,mpeg,asf,avi)。大小限定在1M以内。

当前页预览

弹出预览页面：

function getstr()

{

var strcode="";

var width=100;

var high=100;

if(self.opener.document.getElementById("FileUp")!=null)

{

//strcode=self.opener.document.getElementById("previewImage").innerHTML;

width=self.opener.document.getElementById("lblWidth").innerText;

high=self.opener.document.getElementById("lblHigh").innerText;

var fileName=self.opener.document.getElementById("FileUp").value;

var exName=fileName.substr(fileName.lastIndexOf(".")+1).toUpperCase()

if(exName=="JPG"||exName=="BMP"||exName=="GIF")

{

//document.getElementById("myimg").src=fileName;

strcode='';

}

else

if(exName=="SWF")

{

strcode='';

}

else

if(exName=="WMV"||exName=="MPEG"||exName=="ASF"||exName=="AVI")

{

strcode='

strcode+=' autoStart=\'1\' playCount=\'0\' enableContextMenu=\'0\' type=\'application/x-mplayer2\'>

';

}

}

if(self.opener.document.getElementById("txtADCode")!=null)

{

strcode=self.opener.document.getElementById("txtADCode").innerHTML;

}

if(strcode!="")

{

//window.alert(fileName);

document.getElementById("showimg").innerHTML=strcode;

}

}

显示：