JS上传文件前预览本地图片(转)

 

例子如下： < input id="file" type="file" οnfοcus="javascript:ShowImage(this.value,document.getElementById('img'))"> < br /> < img id="img" STYLE="visibility:hidden" height="100px" width="100px"> < script language="javascript" type="text/javascript"> //============================== //功能:Javascript本地图片预览 //说明:简单的判断了文件的合法性 //适用于:上传文件前预览本地图片 //==============================    function ShowImage(value,img)     {        //alert(value);        //检测盘符        //alert(value.indexOf(':'));        //检测文件是否有扩展名        //alert(value.length-value.lastIndexOf('.'));        //取文件扩展名        //alert(value.substr(value.length-3,3));        //检测文件扩展名是否合法        //alert(CheckExt(value.substr(value.length-3,3)));                if(value.length>5&&value.indexOf(':')==1&&(value.length-value.lastIndexOf('.'))==4&&CheckExt(value.substr(value.length-3,3)))         {             img.src=value;             img.alt="本地图片预览";             img.style.visibility="visible";         }         else         {       img.style.visibility="hidden";      }     }     //检查扩展名是否合法,合法返回True     function CheckExt(ext)     {     //这里设置允许的扩展名     var AllowExt="jpg|gif|jpeg|png|bmp";     var ExtOK=false;     var ArrayExt;     if(AllowExt.indexOf('|')!=-1)     {      ArrayExt=AllowExt.split('|');      for(i=0;i<ArrayExt.length;i++)      {       if(ext.toLowerCase()==ArrayExt[i])       {        ExtOK=true;        break;       }      }     }     else     {      ArrayExt=AllowExt;      if(ext.toLowerCase()==ArrayExt)      {       ExtOK=true;      }     }     return ExtOK;     } < /script> 使用new创建对象的过程。 （1）当解释器遇到new操作符时便创建一个空对象； （2）开始运行class1这个函数，并将其中的this指针都指向这个新建的对象； （3）因为当给对象不存在的属性赋值时，解释器就会为对象创建该属性，例如在class1中，当执行到this.p1=s这条语句时，就会添加一个属性p1，并把变量s的值赋给它，这样函数执行就是初始化这个对象的过程，即实现构造函数的作用； （4）当函数执行完后，new操作符就返回初始化后的对象。 通过这整个过程，JavaScript中就实现了面向对象的基本机制。由此可见，在JavaScript中，function的定义实际上就是实现一个对象的构造器， prototype是一个JavaScript对象，可以为prototype对象添加、修改、删除方法和属性。从而为一个类添加成员定义。 了解了函数的prototype对象，现在再来看new的执行过程。 （1）创建一个新的对象，并让this指针指向它； （2）将函数的prototype对象的所有成员都赋给这个新对象； （3）执行函数体，对这个对象进行初始化操作； （4）返回（1）中创建的对象。 和上一节介绍的new的执行过程相比，多了用prototype来初始化对象的过程，这也和prototype的字面意思相符，它是所对应类的实例的原型。这个初始化过程发生在函数体（构造器）执行之前，所以可以在函数体内部调用prototype中定义的属性和方法，