上传图片在客户端用Javascript做图片检验，并显示图片缩略图
function PreviewImage(x)
{
//var x = document.getElementById('File1');
var xid=x.id+"";
var index=xid.substr(xid.length-1,1);
if(!x || !x.value)
{
return false;
}
var patn = /\.jpg$|\.jpeg$|\.bmp$|\.gif$/i;
try
{
var obj = document.getElementById('PhotoPreviewImg'+index);
var barType=index;
//默认普通标题图
var width=120;
var height=80;
if (barType==2) //首页标题图
{
width=120;
height=90;
}
else if (barType==3) //焦点图
{
width=320;
height=240;
}
if(patn.test(x.value))
{
var prvImg = "<img src='file://localhost/" + x.value + "' style='width: "+ width +"px; height: "+ height +"px; border: 1;' />";
var prvImgsrc = 'file://localhost/' + x.value;
document.getElementById("PhotoPreviewImg"+index).innerHTML=prvImg;
//setTimeout('CheckImg()',300);
//imgwh = new Image();
//imgwh.src = "file://localhost/" + x.value;
//CheckImg();
}
else
{
alert("您选择的似乎不是图像文件");
return false;
}
}
catch(e)
{
alert("您选择文件无法预览，或网络故障无法上传，请稍候再试！");
return false;
}
}
function CheckImg()
{
if(document.getElementById("PhotoPreviewImg").fileSize==-1||document.getElementById("PhotoPreviewImg").fileSize>5000000)
{
document.getElementById("File1").disabled=false;
//document.getElementById("PhotoPreviewImg").className='imgPrev0';
document.getElementById("PhotoPreviewImg").src="";
LoadEmptyImage ();
alert("您选择文件超过5M，无法上传！");
return false;
}
else
{
document.getElementById("File1").disabled=false;
}
document.getElementById("PhotoPreviewImg").className='';
var originwidth=document.getElementById("PhotoPreviewImg").width*10;
var originheight=document.getElementById("PhotoPreviewImg").height*10;
var scale=originwidth/originheight;
document.getElementById("PhotoPreviewImg").style.top=20;
document.getElementById("PhotoPreviewImg").style.left=20;
if(scale>0.8)
{
document.getElementById("PhotoPreviewImg").className='imgPrev2';
var largerheight=document.getElementById("PhotoPreviewImg").height;
var leftover=(150-largerheight)/2;
document.getElementById("PhotoPreviewImg").style.marginLeft=2;
document.getElementById("PhotoPreviewImg").style.marginTop=leftover;
}
else
{
document.getElementById("PhotoPreviewImg").style.marginTop=2;
document.getElementById("PhotoPreviewImg").className='imgPrev1';
var largerwidth=document.getElementById("PhotoPreviewImg").width;
var leftover=(120-largerwidth)/2;
document.getElementById("PhotoPreviewImg").style.marginLeft=leftover;
}
return true;
}
<script type="text/javascript" defer>
function checkit(obj)
{
if (obj.value.length >= 16)
{
alert("在这里输入照片标题，不超过16个字！");
var str = obj.value;
obj.value = str.substring(0,16);
return false;
}
return true;
}
function empty()
{
if(document.getElementById("<%= phDescription1.ClientID%>").value == "" || document.getElementById("<%= phDescription1.ClientID%>").value == "在这里输入照片标题，不超过16个字")
{
document.getElementById("<%= phDescription1.ClientID%>").value = "";
}
}
function noempty()
{
if(document.getElementById("<%= phDescription1.ClientID%>").value == "")
{
document.getElementById("<%= phDescription1.ClientID%>").value = "在这里输入照片标题，不超过16个字";
}
}
var imgwh;
function PreviewImage1()
{
var x = document.getElementById('<% = UpImg1.ClientID %>');
if(x != null)
{
checkupfile(x);
}
}
function checkupfile(x)
{
if(!x || !x.value)
{
return false;
}
var patn = /\.jpg$|\.jpeg$|\.bmp$|\.gif$/i;
try
{
if(!patn.test(x.value))
{
alert("您选择的图片格式不正确，请选择jpg，jepg，gif，bmp格式的图片！");
return false;
}
else
{
imgwh = new Image();
imgwh.src = x.value;
}
}
catch(e)
{
//alert("您选择文件无法预览，或网络故障无法上传，请稍候再试！");
return false;
}
}
function BeforeSaveClick()
{
var x = document.getElementById("<% = UpImg1.ClientID %>");
if(!x || !x.value)
{
document.getElementById('<%= Span1.ClientID%>').innerHTML = "请选择要上传的照片。";
return false;
}
var patn = /\.jpg$|\.jpeg$|\.bmp$|\.gif$/i;
try
{
if(!patn.test(x.value))
{
alert("您选择的图片格式不正确，请选择jpg，jepg，gif，bmp格式的图片！");
return false;
}
else
{
var sz = imgwh.width + "x" + imgwh.height;
document.getElementById("hidImageWH").value = sz;
document.getElementById("hidImageWH_url").value = x.value;
return true;
}
}
catch(e)
{
alert("网络故障无法上传，请稍候再试！");
return false;
}
}
</script>
function checkit(obj)
{
if (obj.value.length >= 16)
{
alert("在这里输入照片标题，不超过16个字！");
var str = obj.value;
obj.value = str.substring(0,16);
return false;
}
return true;
}
function empty()
{
if(document.getElementById("<%= phDescription1.ClientID%>").value == "" || document.getElementById("<%= phDescription1.ClientID%>").value == "在这里输入照片标题，不超过16个字")
{
document.getElementById("<%= phDescription1.ClientID%>").value = "";
}
}
function noempty()
{
if(document.getElementById("<%= phDescription1.ClientID%>").value == "")
{
document.getElementById("<%= phDescription1.ClientID%>").value = "在这里输入照片标题，不超过16个字";
}
}
var imgwh;
function PreviewImage1()
{
var x = document.getElementById('<% = UpImg1.ClientID %>');
if(x != null)
{
checkupfile(x);
}
}
function checkupfile(x)
{
if(!x || !x.value)
{
return false;
}
var patn = /\.jpg$|\.jpeg$|\.bmp$|\.gif$/i;
try
{
if(!patn.test(x.value))
{
alert("您选择的图片格式不正确，请选择jpg，jepg，gif，bmp格式的图片！");
return false;
}
else
{
imgwh = new Image();
imgwh.src = x.value;
}
}
catch(e)
{
//alert("您选择文件无法预览，或网络故障无法上传，请稍候再试！");
return false;
}
}
function BeforeSaveClick()
{
var x = document.getElementById("<% = UpImg1.ClientID %>");
if(!x || !x.value)
{
document.getElementById('<%= Span1.ClientID%>').innerHTML = "请选择要上传的照片。";
return false;
}
var patn = /\.jpg$|\.jpeg$|\.bmp$|\.gif$/i;
try
{
if(!patn.test(x.value))
{
alert("您选择的图片格式不正确，请选择jpg，jepg，gif，bmp格式的图片！");
return false;
}
else
{
var sz = imgwh.width + "x" + imgwh.height;
document.getElementById("hidImageWH").value = sz;
document.getElementById("hidImageWH_url").value = x.value;
return true;
}
}
catch(e)
{
alert("网络故障无法上传，请稍候再试！");
return false;
}
}
</script>
