js根据图片路径地址判断图片是否存在的几种方法

阅读: 评论:0

js根据图片路径地址判断图片是否存在的几种方法

js根据图片路径地址判断图片是否存在的几种方法

js根据图片路径地址判断图片是否存在的几种方法,可以是远程图片或是是本地上传的图片 转自:.html

1、 

function CheckImgExists(imgurl) {   var ImgObj = new Image(); //判断图片是否存在   ImgObj.src = imgurl;   //没有图片,则返回-1   if (ImgObj.fileSize > 0 || (ImgObj.width > 0 && ImgObj.height > 0)) {   return true;   } else {   return false; }  
<form  enctype= "multipart/form-data "  method= "POST "  οnsubmit= "return  HasChecked; "> 
<fieldset  style= "width:  372;  height:  60;padding:2px; "> 
<legend> <font  color= "#FF0000 "> 图片来源 </font> </legend> 
<input  type= "radio "  name= "radio1 "  checked  οnclick= "SwitchUpType(true); "> 本地 <input  type= "radio "  name= "radio1 "  οnclick= "SwitchUpType(false); "> 远程: <input  type= "file "  name= "file1 "  οnchange= "CheckExt(this) "  style= "width:180px; ">  <input  type= "submit "  id= "UploadButton "  value= "开始上传 "  disabled> <br>  }  2、 JS+XMLHTTP var oreq = new ActiveXObject("Microsoft.XMLHTTP")
oreq.open("Get","blog/attachments/month_0606/s2006610204959.jpg",false);
oreq.send();
alert(oReq.status)
if(oReq.status==404)
alert('不存在');
else
alert("存在")
} 3、 <title> 文件上传前台控制检测程序  v0.6 </title> 
<style> 
body,td{font-size:12px;} 
</style> 
<script  language=javascript> 



var  ImgObj=new  Image();             //建立一个图像对象 

var  AllImgExt= ".jpg|.jpeg|.gif|.bmp|.png| "//全部图片格式类型 
var  FileObj,ImgFileSize,ImgWidth,ImgHeight,FileExt,ErrMsg,FileMsg,HasCheked,IsImg//全局变量  图片相关属性 

//以下为限制变量 
var  AllowExt= ".jpg|.gif|.doc|.txt| "     //允许上传的文件类型  &#320;为无限制  每个扩展名后边要加一个 "| "  小写字母表示 
//var  AllowExt=0 
var  AllowImgFileSize=70;         //允许上传图片文件的大小  0为无限制   单位:KB   
var  AllowImgWidth=500;             //允许上传的图片的宽度  &#320;为无限制 单位:px(像素) 
var  AllowImgHeight=500;             //允许上传的图片的高度  &#320;为无限制 单位:px(像素) 

HasChecked=false; 

function  CheckProperty(obj)         //检测图像属性 

FileObj=obj; 
if(ErrMsg!= " ")             //检测是否为正确的图像文件 返回出错信息并重置 

ShowMsg(ErrMsg,false); 
return  false;             //返回 


adyState!= "complete ")     //如果图像是未加载完成进行循环检测 

setTimeout( "CheckProperty(FileObj) ",500); 
return  false; 


ImgFileSize&#und(ImgObj.fileSize/1024*100)/100;//取得图片文件的大小 
ImgWidth=ImgObj.width             //取得图片的宽度 
ImgHeight=ImgObj.height;         //取得图片的高度 
FileMsg= "n图片大小: "+ImgWidth+ "* "+ImgHeight+ "px "; 
FileMsg=FileMsg+ "n图片文件大小: "+ImgFileSize+ "Kb "; 
FileMsg=FileMsg+ "n图片文件扩展名: "+FileExt; 

if(AllowImgWidth!=0&&AllowImgWidth <ImgWidth) 
ErrMsg=ErrMsg+ "n图片宽度超过限制。请上传宽度小于 "+AllowImgWidth+ "px的文件,当前图片宽度为 "+ImgWidth+ "px "; 

if(AllowImgHeight!=0&&AllowImgHeight <ImgHeight) 
ErrMsg=ErrMsg+ "n图片高度超过限制。请上传高度小于 "+AllowImgHeight+ "px的文件,当前图片高度为 "+ImgHeight+ "px "; 

if(AllowImgFileSize!=0&&AllowImgFileSize <ImgFileSize) 
ErrMsg=ErrMsg+ "n图片文件大小超过限制。请上传小于 "+AllowImgFileSize+ "KB的文件,当前文件大小为 "+ImgFileSize+ "KB "; 

if(ErrMsg!= " ") 
ShowMsg(ErrMsg,false); 
else 
ShowMsg(FileMsg,true); 


ImgObj.οnerrοr=function(){ErrMsg= 'n图片格式不正确或者图片已损坏! '} 

function  ShowMsg(msg,tf)     //显示提示信息  tf=true  显示文件信息  tf=false  显示错误信息  msg-信息内容 

msg&#place( "n ", " <li> "); 
msg&#place(/n/gi, " <li> "); 
if(!tf) 

document.all.UploadButton.disabled=true; 
FileObj.outerHTML=FileObj.outerHTML; 
MsgList.innerHTML=msg; 
HasChecked=false; 

else 

document.all.UploadButton.disabled=false; 
if(IsImg) 
PreviewImg.innerHTML= " <img  src= ' "+ImgObj.src+ " '  width= '60 '  height= '60 '> " 
else 
PreviewImg.innerHTML= "非图片文件 "; 
MsgList.innerHTML=msg; 
HasChecked=true; 



function  CheckExt(obj) 

ErrMsg= " "; 
FileMsg= " "; 
FileObj=obj; 
IsImg=false; 
HasChecked=false; 
PreviewImg.innerHTML= "预览区 "; 
if(obj.value== " ")return  false; 
MsgList.innerHTML= "文件信息处理中... "; 
document.all.UploadButton.disabled=true; 
FileExt=obj.value.substr(obj.value.lastIndexOf( ". ")).toLowerCase(); 
if(AllowExt!=0&&AllowExt.indexOf(FileExt+ "| ")==-1)     //判断文件类型是否允许上传 

ErrMsg= "n该文件类型不允许上传。请上传  "+AllowExt+ "  类型的文件,当前文件类型为 "+FileExt; 
ShowMsg(ErrMsg,false); 
return  false; 


if(AllImgExt.indexOf(FileExt+ "| ")!=-1)         //如果图片文件,则进行图片信息处理 

IsImg=true; 
ImgObj.src=obj.value; 
CheckProperty(obj); 
return  false; 

else 

FileMsg= "n文件扩展名: "+FileExt; 
ShowMsg(FileMsg,true); 




function  SwitchUpType(tf) 

if(tf) 
str= ' <input  type= "file "  name= "file1 "  οnchange= "CheckExt(this) "  style= "width:180px; "> ' 
else 
str= ' <input  type= "text "  name= "file1 "  οnblur= "CheckExt(this) "  style= "width:180px; "> ' 
document.all.file1.outerHTML=str; 
document.all.UploadButton.disabled=true; 
MsgList.innerHTML= " "; 


</script> 
<div  style= "border:1  solid  #808080;background:#E0E0E0;width100%;height:20px;color:#606060;padding:5px; "> 
<table  border= "0 "> <tr> <td  width= "60 "  id= "PreviewImg "> 预览区 </td> <td  id= "MsgList "  valign= "top "> </td> </tr> </table> 
</div> 
</fieldset> 
</form> 4、用onerror替换不存在的图片 <img src="images/img1.jpg" height="300" width="800" images/defaultImg.jpg';">

本文发布于:2024-01-31 06:15:41,感谢您对本站的认可!

本文链接:https://www.4u4v.net/it/170665294326128.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

留言与评论(共有 0 条评论)
   
验证码:

Copyright ©2019-2022 Comsenz Inc.Powered by ©

网站地图1 网站地图2 网站地图3 网站地图4 网站地图5 网站地图6 网站地图7 网站地图8 网站地图9 网站地图10 网站地图11 网站地图12 网站地图13 网站地图14 网站地图15 网站地图16 网站地图17 网站地图18 网站地图19 网站地图20 网站地图21 网站地图22/a> 网站地图23