经过分析,发现网页中存在类似如下的代码:
<img src=”pic.gif” onerror=”javascript:this.src=’/noPic.gif’;” alt=”pic” />
分析:特别注意 onerror,当图片不存在时,将触发 onerror,而 onerror 中又为 img 指定一个 NoPic.gif
图片。也就是说图片存在则显示 pic.gif,图片不存在将显示 noPic.gif。但问题来了,如果 noPic.gif 也不存在,则继续触发
onerror,导致循环,故出现错误。
说明:如果图片存在,但网络很不通畅,也可能触发 onerror。
解决方法:
第一种::.去掉 onerror 代码;或者更改 onerror 代码为其它;或者确保 onerror 中的图片足够小,并且存在。
第二种:
<script type=”text/javascript”>
<!–
function nofind(){
var img=event.srcElement;
img.src=”../../../sys/common/image/fileoperation/icon/default.gif”;
img.onerror=null; 控制不要一直跳动
}
//–>
</script>
<img src=”../../../sys/common/image/fileoperation/icon/${file.suffix }.gif” onerror=”nofind();” />${file.name }</td>
分享到:
相关推荐
在JavaScript中处理img元素加载图片时,onerror事件是一个非常重要的错误处理机制,它在图片加载失败时触发。然而,如果不正确地使用onerror事件处理器,可能会导致程序行为不正确,甚至出现栈溢出(Stack overflow...
3. 在 img 元素上添加 onerror 事件,并在事件处理函数中设置默认图片的 URL。 下面是示例代码: ``` <div id="container"></div> window.onload=function(){ var container = document.getElementById(...
同时,为了防止默认图片再次触发onerror事件,需要将img元素的onerror属性置为null,从而避免无限循环的问题。 下面提供一个具体的实现示例: ```javascript function errorImg(img) { img.src = "***"; // 这里...
请注意,`<img>`标签的`onerror`事件处理器没有额外的参数,只能通过修改`this`(即当前图片元素)的`src`属性来处理错误。 总结来说,`onerror`事件是JavaScript中不可或缺的错误处理机制,它允许开发者对脚本和...
为了改善这一情况,可以通过JavaScript的onerror事件处理机制来设置当图片加载失败时显示一个默认的图像,从而提高网页的整体体验。 在HTML中,<img>标签用于嵌入图片。一个典型的<img>标签包括宽度、高度和图片源...
当图片无法加载时,即发生404错误时,onerror事件会被触发,然后执行定义在onerror属性中的JavaScript代码。通常在onerror事件中,将出错的图片地址更换为一个默认的图片地址,这样用户界面不会显示错误信息,用户...
4. onerror事件:除了onload事件外,Image对象还有一个onerror事件,该事件会在图片无法加载时触发。这对于处理图片加载错误情况非常有用。 5. 异步加载图片:在处理大量图片或者需要高效加载的页面时,开发者常常...
$('img').on('load error', function() { // 这里确保无论图片是否加载成功,都会执行 var imgWidth = $(this).width(); var imgHeight = $(this).height(); console.log('Image size:', { width: imgWidth, ...
此外,`img.onerror`事件可以用来处理图片加载失败的情况,确保程序在遇到问题时能够优雅地处理: ```javascript img.onerror = function() { console.error('图片加载失败'); }; ``` 综上所述,通过理解和利用...
img.onerror = reject; img.src = URL.createObjectURL(file); }); } ``` 最后,关于图片的删除,通常在前端是通过JavaScript操作DOM元素来实现的。例如,如果图片显示在一个`<img>`元素上,只需移除该元素即可...
在某些情况下,可能需要添加一个`onerror`事件处理器,以处理图片加载失败的情况。 总的来说,通过JavaScript和适当的CSS,我们可以实现img图片在大小未知的div中自适应显示,并兼容多种浏览器,包括老版本的IE。...
3. **事件处理**:FileReader提供了`onload`、`onerror`和`onprogress`等事件,用于处理读取完成、错误或进度更新的情况。例如,`onload`事件通常用于在文件读取成功后执行代码,如显示预览图片。 4. **数据URL**:...
当从网络加载图片失败时,我们可以使用 img 标签的 onerror 属性来显示默认图片。onerror 属性可以指定当图片加载失败时执行的 JavaScript 代码。在这里,我们可以将默认图片的 URL 赋值给 img 标签的 src 属性,...
总结来说,要在IE9浏览器中获取图片尺寸,需要创建`Image`对象、预加载图片、监听`onload`事件,并根据需要处理`onerror`事件。同时,还要注意兼容性和性能优化。在实际项目中,可以结合具体需求选择最适合的实现...
reader.onerror = function (error) { console.error('读取文件失败:', error); }; } ``` `showImageInModal`函数可以创建一个模态窗口,显示大图。这里我们假设有一个模态元素存在,只需设置其`innerHTML`为...
在本例中,为`<img>`元素添加了`onreadystatechange`和`onerror`事件处理程序。 ```javascript img.attachEvent("onreadystatechange", orsc); img.attachEvent("onerror", oe); ``` #### 4. `document.body....
同时,还要注意处理可能的错误,例如`onerror`事件。 6. **代码示例**: ```javascript const fileInput = document.getElementById('fileInput'); fileInput.addEventListener('change', (event) => { const ...
- `onLoadSuccess/onCropSuccess/onError`: 监听图片加载成功、裁剪成功和错误的回调函数。 4. **实例方法** - `crop()`: 执行裁剪操作,裁剪后的结果可以通过`onCropSuccess`事件获取。 - `rotateLeft/...
2. `readAsDataURL(file)`:这个方法用于读取文件,参数`file`是File对象,读取完成后,会触发`onload`或`onerror`事件。 3. `result`属性:当读取成功后,`result`属性会包含读取到的数据,通常是Data URL。 三、...
1. 在`<img>`标签的`src`属性中绑定图片地址,并监听`onerror`事件。当图片加载失败时,会自动触发该事件。 2. 在Vue的`methods`对象中定义一个名为`imgError`的方法。在这个方法里,根据传入的参数(通常是绑定在`...