在上传图片前，提供预览功能

<!--  TWO STEPS TO INSTALL IMAGE UPLOAD PREVIEW: 
   1.   Copy the coding into the HEAD of your HTML document
   2.   Add the last code into the BODY of your HTML document    -->

<!--  STEP ONE: Paste this code into the HEAD of your HTML document    -->

< HEAD >

< script  type ="text/javascript" > ...
<!-- Begin
/**//* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Abraham Joffe :: http://www.abrahamjoffe.com.au/ */

/**//***** CUSTOMIZE THESE VARIABLES *****/

   // width to resize large images to
var maxWidth=600;
   // height to resize large images to
var maxHeight=800;
   // valid file types
var fileTypes=["bmp","gif","png","jpg","jpeg"];
   // the id of the preview image tag
var outImage="previewField";
   // what to display when the image is not valid
var defaultPic="spacer.gif";

/**//***** DO NOT EDIT BELOW *****/

function preview(what)...{
   var source=what.value;
   var ext=source.substring(source.lastIndexOf(".")+1,source.length).toLowerCase();
   for (var i=0; i<fileTypes.length; i++) if (fileTypes[i]==ext) break;
   globalPic=new Image();
   if (i<fileTypes.length) globalPic.src=source;
   else ...{
     globalPic.src=defaultPic;
     alert("THAT IS NOT A VALID IMAGE Please load an image with an extention of one of the following: "+fileTypes.join(", "));
   }
   setTimeout("applyChanges()",200);
}
var globalPic;
function applyChanges()...{
   var field=document.getElementById(outImage);
   var x=parseInt(globalPic.width);
   var y=parseInt(globalPic.height);
   if (x>maxWidth) ...{
     y*=maxWidth/x;
     x=maxWidth;
   }
   if (y>maxHeight) ...{
     x*=maxHeight/y;
     y=maxHeight;
   }
   field.style.display=(x<1 || y<1)?"none":"";
   field.src=globalPic.src;
   field.width=x;
   field.height=y;
}
// End -->
</ script >
</ HEAD >

<!--  STEP TWO: Copy this code into the BODY of your HTML document    -->

< BODY >

< div  align ="center"  style ="line-height: 1.9em;" >
Test it by locating a valid file on your hard drive:
< br >
< input  type ="file"  id ="picField"  onchange ="preview(this)" >
< br >
< img  alt ="Graphic will preview here"  id ="previewField"  src ="spacer.gif" >
< br >   < div  style ="font-size: 7pt;" >
Modify By < a  href ="http://blog.csdn.net/lifuyun" > LiFuyun.net </ a ></ div >
</ div >

< p >< center >
< font  face ="arial, helvetica"  size"-2" > 深海提供 < br >
by  < a  href ="http://blog.csdn.net/lifuyun" > LiFuyun.net </ a ></ font >
</ center >< p >