下传图片-JavaScript 客户端的一系列判断与清空文件域(原创)
<html>
</head>
<body>
<form name="formimg" action="submit.jsp" enctype="multipart/form-data" method="post">
<table width="100%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td valign="top">
<span id="pfile">
<input type="file" name="protectfile" onChange="previewit()" onKeyDown="return false" onpaste="return false;" >
</span>
<div id="preview"></div>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
<input name="updateprotect" type="button" class="BtnConfirm" value="上传" onClick="javascript:updateExe();" />
<input name="usecurprotect" type="button" class="BtnConfirm" value="使用默认图" onClick="javascript:updateExe2();" />
</td>
</tr>
</table>
</form>
</body>
<script language="javascript">
/*
* 预览图片
*/
function previewit()
{
var fileext;
fileext=(document.formimg.protectfile.value.substring(document.formimg.protectfile.value.lastIndexOf("."),document.formimg.protectfile.value.length)).toLowerCase();
if(fileext!='.gif')
{
alert("系统仅支持GIF格式的图片,请选择GIF格式图片!");
document.formimg.protectfile.value="";
document.formimg.protectfile.focus();
return false;
}
else
{
document.getElementById("preview").innerHTML="<span><b>图</b></span><br><img src='"+document.formimg.protectfile.value+"' style='border:2px double #ccc'>" ;
}
}
/*
* 上传图片
*/
function updateExe(){
var filename = document.formimg.protectfile.value;
if(filename== ""){
alert("您还没有选择警告图片文件");
return;
}else{
if(filename.substr(filename.length-4,4).toLowerCase().match("^.gif$") == null) {
alert("图像类型不是GIF类型");
return;
}else{
// 照片的大小验证
var img = new Image();
var MAXSIZE = 1000;
alert(filename);
img.src = filename;
alert(img.fileSize);
if (img.fileSize > MAXSIZE*1024) {
alert( " 请上传小于 1M 的图片 " );
return false ;
}
alert("我要提交了.");
//document.formimg.submit(); //提交
}
}
}
//首先清空文件域
function updateExe2(){
document.getElementById("pfile").innerHTML = "<input type=\"file\" name=\"protectfile\" onKeyDown=\"return false;\" onpaste=\"return false;\"/>";
document.formimg.submit(); //提交
}
</script>
</html>