img标签在使用的时候 一下几个事件非常的有用:
onError:当图片加载出现错误,会触发 经常在这里事件里头写入 将图片导向默认报错图片,以免页面上出现红色的叉叉
onLoad:事件是当图片加载完成之后触发
onAbort:图片加载的时候,用户通过点击停止加载(浏览器上的红色叉叉)时出发,通常在这里触发一个提示:“图片正在加载”<html>
<head>
<script>
/**
* 图片出错处理,可以重加载指定的图片。超过重试次数仍不能正常显示的,显示缺省图片。
* 示例<img onerror="showImgDelay(this,'1.jpg',2)" src="1.jpg">
*
* imgObj:img节点对象
* imgSrc:出错时加载的图片地址
* maxErrorNum:最大出错次数,防止出现死循环
*/
function showImgDelay(imgObj,imgSrc,maxErrorNum){
showSpan.innerHTML += "--" + maxErrorNum;
if(maxErrorNum>0){
imgObj.onerror=function(){
showImgDelay(imgObj,imgSrc,maxErrorNum-1);
};
setTimeout(function(){
imgObj.src=imgSrc;
},500);
}else{
imgObj.onerror=null;
imgObj.src="images/default.jpg";
}
}
</script>
</head>
<body>
<img onerror="showImgDelay(this,'1a.jpg',2);" src="1a.jpg" width="200" height="200"/>
<span id="showSpan"></span>
</body>
</html>
这个不能滥用!!!
对图片要求较高时,如考试报名系统,在线考试系统,显示考生的照片时。
很好的利用这3个事件可以在HTML中实现很多图片的功能
例如:处理图片加载失败情况:<img src="image/1.jpg" width="258" height="178" onerror="this.src='images/isets.jpg'" />
IMG的onerror自动选择最快线路,根据服务器返回 错误:<img src="http://dianxin.xxx.com/NotExistsUrl" width="1" height="1"
onerror="location.top.url='http://dianxin.xxx.com/'"/>
<img src="http://wangtong.xxx.com/NotExistsUrl" width="1" height="1"
onerror="location.top.url='http://wangtong.xxx.com/'"/>
复制代码例如,你可能会利用这个onAbort消息来警告用户,提醒他们停止某个重要图像的加载,例如图像映射:
<img src="pics/camnpr.gif" usemap="#map1" onAbort="window.alert('注意:这张照片含有重要的链接,请重新载入.')">
分享到:
相关推荐
在IT行业中,图像格式的转换是一项常见的任务,特别是在软件开发和系统定制中。...这个工具的使用对于了解安卓系统架构和刷机流程的用户非常有用,可以帮助他们在保持系统稳定的同时增添个人风格。
总结一下,`linux.img` 文件是用于 QEMU 的 Linux 操作系统镜像,它允许用户在虚拟环境中运行 Linux。这个过程涉及到虚拟化技术,特别是 QEMU 的全系统模拟,以及如何在 QEMU 中加载和使用这种镜像文件。对于开发、...
除了基本的图像标注功能,Labelimg还支持批量处理,这在处理大量图像时非常有用。用户可以创建一个文本文件,列出所有要标注的图片路径,然后通过Labelimg的命令行参数批量打开和处理。 总的来说,Labelimg是...
源码部分通常包括以下几个关键组件: - **用户界面**:这部分代码负责构建图形用户界面,可能使用了如Qt或wxPython这样的库。 - **图像处理**:用于加载、显示和保存图像的代码,可能涉及PIL(Python Imaging ...
关于与LabelImg相关的技术,这里有几个关键点: 1. **TensorFlow数据集**:TensorFlow是一个强大的开源机器学习框架,它支持构建和训练各种深度学习模型。使用LabelImg标注的图像可以轻松转换为TensorFlow数据集格式...
本文主要聚焦于Struts中的几个关键标签库,包括HTML、Bean、Logic、Nested和Tiles标签库,以及Struts-EL和JSTL的使用。 首先,HTML标签库是Struts中最基础的部分,它提供了与HTML元素对应的定制标签,目的是为了更...
这个工具的主要功能是将.dmg格式的镜像文件转换为.iso格式,这对于在非macOS环境中处理macOS安装盘或者软件镜像非常有用。在Windows或者其他操作系统上,.iso格式更为通用,因此dmg2img工具成为了跨平台操作的关键。...
下面我们将深入探讨这个领域的几个关键知识点。 1. **HTML解析**:首先,我们需要理解HTML(超文本标记语言)的基本结构。HTML由一系列标签组成,这些标签描述了网页的内容和布局。VB中可以使用MSXML库或者第三方库...
LabelImg的工作流程通常包括以下几个步骤: 1. **启动与加载图像**:用户启动LabelImg应用后,可以导入需要标注的图像。支持多种图像格式,如.jpg、.png等。 2. **创建或导入标注**:用户可以选择创建新的标注,...
在正则表达式的应用中,以下几个知识点值得深入理解和掌握: 1. 正则表达式的元字符:在正则表达式中,有一些特殊的字符被称为元字符,比如点号(`.`)、星号(`*`)、问号(`?`)等。它们在正则表达式中有着特殊的...
5. ****:这是一个非常有用的标签,用于显示用户输入验证时的错误信息。它会查找Request对象中的ActionErrors,并呈现由MessageResources配置的错误消息。 **标签的公共特性** Struts的HTML标签通常具有以下几个...
异常处理程序:能够让系统在出现异常的情况下恢复过来的程序使用异常处理情况:异常诊断与异常处理不在同一个位置下时使用异常处理程序(若用户一直通过键盘与程序通话,那么就不能使用处理键盘输入处理)使用异常的...
在IT领域,Java爬虫是一种常见的技术,用于自动地抓取网页信息,特别是对于大量数据的获取非常有用。本项目“Java爬虫+URL获取Img高宽”专注于一个特定的应用场景,即通过Java爬虫从网页中提取图片(Img)的URL,并...
在这个类中,首先定义了几个静态的正则表达式字符串,这些字符串是用于匹配不同的HTML标签和属性的。例如,`regxpForHtml`用于匹配任何以小于号`开头且以大于号`>`结尾的HTML标签,`regxpForImgTag`用于匹配`<img>`...
根据给定文件的信息,我们可以提炼出以下几个相关的IT知识点: ### 1. 正则表达式在Java中的应用 正则表达式(Regular Expression)是一种强大的文本处理工具,它能够帮助我们快速地匹配、查找和替换符合规则的...
除了上述标签外,还有一些其他的HTML标签,它们在特定场景下非常有用。 - **`<hr>`**:水平线,用于分隔页面的不同部分。 - **`<img>`**:用于插入图像。 - **`<a>`**:超链接,用于链接到其他页面或位置。 - **`...
描述部分提到了几个关键功能和格式:“数据恢复软件”说明这个工具具备恢复丢失或损坏文件的能力,它能够从硬盘或其他存储设备中找出并恢复因各种原因丢失的数据。“坏道拷贝软件”表示MTL5.1具有复制坏道的功能,这...
由于不支持中文路径,用户在使用时需要注意以下几点: 1. **创建英文目录**:确保所有图像数据集的路径都是英文的,包括图像的文件名。 2. **解压位置**:将压缩包解压到一个英文路径的文件夹内。 3. **运行命令**...