- <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <htmlxmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title>validatebeforeuploadbyLanceZhang</title>
- </head>
- <bodystyle="font-family:Calibri">
- <formname="Myform">
- <p>
- <fontcolor="red"size="6">Filetype:gif,jpg,jpeg,png,bmp</font></p>
- <p>
- FileSizelimit:
- <inputtype="text"size="4"value="100"name="fileSizeLimit"id="fileSizeLimit"/>
- K</p>
- <p>
- ImageHeightLimit:<inputtype="text"size="4"value="100"name="heightLimit"id="heightLimit"/>
- </p>
- <p>
- ImageWidthLimit:<inputtype="text"size="4"value="100"name="widthLimit"id="widthLimit"/>
- </p>
- <p>
- <inputtype="file"name="photo"onchange="changeSrc(this)"/>
- ImagePreview<imgsrc="about:blank"id="fileChecker"name="fileChecker"alt="test"/>
- </p>
- <p>
- <inputtype="submit"value="submit">
- </p>
- </form>
- <scripttype="text/javascript">
- functionCheckFileSize()
- {
- varlimit=document.getElementById("fileSizeLimit").value*1024;
- varwidth=document.getElementById("widthLimit").value;
- varheight=document.getElementById("heightLimit").value;
- if(oFileChecker.fileSize>limit)
- {
- alert("FileSize:"+oFileChecker.fileSize+"byte--toolarge!");
- }
- else
- {
- alert("FileSize:"+oFileChecker.fileSize+"byte--ok");
- }
- if(oFileChecker.height>height)
- {
- alert("ImageHeight:"+oFileChecker.height+"--tooheight!");
- }
- else
- {
- alert("ImageHeight:"+oFileChecker.height+"--ok");
- }
- if(oFileChecker.width>width)
- {
- alert("ImageWidth:"+oFileChecker.width+"--toowidth!");
- }
- else
- {
- alert("ImageWidth:"+oFileChecker.width+"--ok");
- }
- returnfalse;
- }
- varright_type=newArray(".gif",".jpg",".jpeg",".png",".bmp");
- varoFileChecker=document.getElementById("fileChecker");
- functionchangeSrc(filePicker)
- {
- if(!checkImgType(filePicker.value))
- {
- alert("thefiletypeisnotcorrect");
- return;
- }
- oFileChecker.src=filePicker.value;
- }
- oFileChecker.onreadystatechange=function()
- {
- if(oFileChecker.readyState=="complete")
- {
- CheckFileSize();
- }
- }
- functioncheckImgType(fileURL)
- {
- varright_typeright_typeLen=right_type.length;
- varimgUrl=fileURL.toLowerCase();
- varpostfixLen=imgUrl.length;
- varlen4=imgUrl.substring(postfixLen-4,postfixLen);
- varlen5=imgUrl.substring(postfixLen-5,postfixLen);
- for(i=0;i<right_typeLen;i++)
- {
- if((len4==right_type[i])||(len5==right_type[i]))
- {
- returntrue;
- }
- }
- }
- </script>
- </body>
- </html>
图片上传之前检查大小、尺寸、格式并预览
最新推荐文章于 2024-09-16 08:47:17 发布