JS上傳檔案前預覽本地圖片)

 

例子如下： < input id="file" type="file" onfocus="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操作符時便建立一個Null 物件； （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中定義的屬性和方法，