日期:2014-05-16  浏览次数:20478 次

上传图片-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>