none
一个js客户端判断上传是否复合指定扩展名 RRS feed

  • 问题

  •  以下是代码。但是页面运行有错误。不知道那里出问题。请求帮助谢谢

    <html>
    <head>
    <title>上传图片</title>
    <link rel="stylesheet" type="text/css" href="common.css">
    <meta name="description" content="图片上传工具-">
    <script language="javascript" type="text/javascript">
    <!--
      function checkImage(strUrlFrom)
      {
    
      	if(strUrlFrom==null)
      	{
      		strUrlFrom="";
      	}
      	strUrl=strUrlFrom.toLowerCase().trim();
      	if(strUrl.length<=3)
      	{
      		alert("只能上传 .BMP .JPG .JPEG .PNG .GIF 文件!");
      		return;
      	}
      	var isOk=false;
      	var arrExts=new Array(".bmp",".jpg",".jpeg",".png",".gif");
      	for(var i=0;i<arrExts.length;i++)
      	{
      		if(strUrl.lastIndexOf(arrExts[i])>3)
      		{
      			isOk=true;
      			break;
      		}
      	}
      	if(!isOk)
      	{
      		alert("只能上传 .BMP .JPG .JPEG .PNG .GIF 文件!");
      		return;
      	}
      	else
      	{
      		document.FrmUploadImage.IMAGE_PREVIEW.src=strUrl;
      		document.FrmUploadImage.IMAGE_CHK.src=strUrl;
      		document.FrmUploadImage.IMAGE_CHK.style.display='';
      		var oldWidth=document.FrmUploadImage.IMAGE_CHK.width;
      		var oldHeight=document.FrmUploadImage.IMAGE_CHK.height;
      		var oldSize=document.FrmUploadImage.IMAGE_CHK.fileSize;
      		var oldSizeKB=oldSize/1024;
      		document.FrmUploadImage.IMAGE_CHK.style.display='none';
      		document.FrmUploadImage.IMAGE_PREVIEW.border="1";
      		IMAGE_FORMAT.innerHTML=strUrl.substring(strUrl.lastIndexOf(".")+1).toUpperCase();
      		IMAGE_RECT.innerHTML=oldWidth+"/"+oldHeight;
      		IMAGE_SIZE.innerHTML=oldSizeKB+" KB("+oldSize+" Bytes)";
    
      		return;
      	}
      }
    //-->
    </script>
    </head>
    
    <body link="#0000FF" vlink="#0000FF" alink="#FF0000" bgcolor="#D6D3CE" topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">
    <form name="FrmUploadImage" method="post"  enctype="multipart/form-data">
    <div align="center">
    	<table border="1" width="100%" cellspacing="1" cellpadding="0" bordercolorlight="#808080" bordercolordark="#C0C0C0" bgcolor="#D6D3CE" height="100%" id="table1">
    		<tr>
    			<td valign="top">
    			<table border="0" width="100%" id="table2" cellspacing="0" cellpadding="5" height="100%">
    				<tr>
    					<td colspan="2" style="border: 1px solid #808080" bgcolor="#EFEFEF">
    					<table border="0" width="100%" cellspacing="0" cellpadding="0" id="table3">
    						<tr>
    							<td class="blue">&nbsp;<img border="0" src="images/uit_e3_imgupicon.gif" width="12" height="15">
    							图片上传工具-Powered by UIT-E3</td>
    							<td>
    					<img border="0" src="images/control_exit.gif" align="right" style="cursor:hand" onclick="JavaScript:window.close();"></td>
    						</tr>
    					</table>
    					</td>
    				</tr>
    				<tr>
    					<td width="614" colspan="2">
    					<p align="left" class="blue">· 选择文件:<input type="file" name="IMAGE_UP" size="63" onpropertychange="JavaScript:checkImage(this.value);" accesskey="B"></td>
    				</tr>
    				<tr>
    					<td width="325" class="blue" align="left">· 图 片
    					预 览 </td>
    					<td width="269" class="blue" align="left">·文 件 信 息</td>
    				</tr>
    				<tr>
    					<td width="301" rowspan="2">
    					<p align="center">
    
    					<img name="IMAGE_PREVIEW" border="0" src="images/nopic.gif" width="300" height="300"></td>
    					<td width="293" valign="top" class="blue">
    					 <p class="blue">&nbsp;&nbsp;&nbsp; 格&nbsp;&nbsp;&nbsp;&nbsp; 式: <span id="IMAGE_FORMAT" class="red">未知</span></p>
    					<p class="blue">&nbsp;&nbsp;&nbsp; 尺寸(W/H): <span id="IMAGE_RECT" class="red">未知</span></p>
    					<p class="blue">&nbsp;&nbsp;&nbsp; 大小 (KB): <span id="IMAGE_SIZE" class="red">未知</span></td>
    				</tr>
    				<tr>
    					<td width="293" valign="top" class="red">
    					<b>注意:</b><p class="red"><b>文件大小限制: 10 MB 之内。</b></p>
    					<p class="red"><b>文件类型限制:.jpg|.jpeg|.png|.gif|.bmp</b><p class="red">
    					<b>文件上传速度视您的网络环境而定!</b></td>
    				</tr>
    				<tr>
    					<td width="614" colspan="2" style="border-left-width: 1px; border-right-width: 1px; border-top-style: solid; border-top-width: 1px; border-bottom-width: 1px">
    					<p align="center"><br>
    					<input type="submit" value="开始上传 Alt+U" name="BtnStartUploadImage" accesskey="U"><br>
     </td>
    				</tr>
    				</table>
    			</td>
    		</tr>
    	</table>
    </div>
    <img name="IMAGE_CHK" style="display:none">
    </form>
    </body>
    </html>

    不用羡慕----那,只是个传说!
    • 已移动 Sheng Jiang 蒋晟 2009年5月15日 17:26 客户端问题 ([Loc]From:ASP.NET 与 AJAX)
    2009年5月15日 3:23

答案

  • trim()不是js内置方法,你不能使用
    既然是使用indexOf了,就无需trim()了

    【孟子E章】
    • 已标记为答案 极度 2009年5月15日 4:11
    2009年5月15日 3:26
    版主
  • 另外,新型浏览器对直接预览客户端图片基本是不支持了(ie7,ie8可以设置),所以
    document.FrmUploadImage.IMAGE_PREVIEW.src=strUrl;
    及其下面的代码将不会有效
    你不要再添加预览功能了,如果真的需要,请改用flash,silverlight
    【孟子E章】
    • 已标记为答案 极度 2009年5月15日 4:11
    2009年5月15日 3:29
    版主

全部回复

  • trim()不是js内置方法,你不能使用
    既然是使用indexOf了,就无需trim()了

    【孟子E章】
    • 已标记为答案 极度 2009年5月15日 4:11
    2009年5月15日 3:26
    版主
  • 另外,新型浏览器对直接预览客户端图片基本是不支持了(ie7,ie8可以设置),所以
    document.FrmUploadImage.IMAGE_PREVIEW.src=strUrl;
    及其下面的代码将不会有效
    你不要再添加预览功能了,如果真的需要,请改用flash,silverlight
    【孟子E章】
    • 已标记为答案 极度 2009年5月15日 4:11
    2009年5月15日 3:29
    版主