上傳圖片前預覽本地圖片

<input id="file" type="file" onfocus="javascript:ShowImage(this.value,document.getElementById('pimg'))">
<br />
<img id="pimg"    style="visibility:hidden" height="100px" width="100px">

<script language="javascript" type="text/javascript">
  //==============================
  //功能:Javascript本地圖片預覽
  //Date:2009-03-30
  //說明:簡單的判斷了文件的合法性
  //適用於:上傳文件前預覽本地圖片
  //==============================
    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>