`

js注意img图片的onerror事件的分析

阅读更多

我们经常在<img>中加个onerror标签,如果图片加载失败把src指定到指定的图片,但是有没有想过如果这个指定的图片也加载失败会怎样,答案是会无限循环,为防止这种错误,可以这样做:

<script type="text/javascript"> 
<!– 
function nofind(){ 
var img=event.srcElement; 
img.src="../../../sys/common/image/fileoperation/icon/default.gif"; 
img.onerror=null; 控制不要一直跳动 

//–> 
</script> 
<td align="center"><img src="../../../sys/common/image/fileoperation/icon/${file.suffix }.gif" onerror="nofind();" />${file.name }</td> 

这样如果加载错误只会执行一次onerror指令,不会出现死循环了。

分享到:
评论

相关推荐

    img标签中onerror用法

    第一个`img`标签用于尝试加载原始图片,并在`onerror`事件触发时将其设置为隐藏(`display: none;`)。同时,通过JavaScript改变第二个隐藏的`img`标签的类(`class`),使其变为可见。这样,即使第一个图片加载失败...

    JS对img标签进行优化使用onerror显示默认图像

    在本文中,将详细讲解如何使用JavaScript中的onerror事件为img标签设置默认图像,以解决图片加载失败的问题。通过编写相应的JS函数,可以确保在图片加载失败时,自动显示一张预设的默认图片,从而避免用户面对空白或...

    解析img图片没找到onerror事件 Stack overflow at line: 0

    然而,当图片无法加载或找不到时,浏览器会触发 `onerror` 事件。这个事件允许开发者定义当图片加载失败时执行的备用操作。在本文中,我们将深入探讨 `onerror` 事件,以及如何处理图片未找到导致的 "Stack overflow...

    利用图片的 onerror 事件载入默认图片

    3. 在 img 元素上添加 onerror 事件,并在事件处理函数中设置默认图片的 URL。 下面是示例代码: ``` &lt;div id="container"&gt;&lt;/div&gt; &lt;script LANGUAGE="JavaScript"&gt; window.onload=function(){ var container = ...

    JavaScript中的onerror事件概述及使用

    请注意,`&lt;img&gt;`标签的`onerror`事件处理器没有额外的参数,只能通过修改`this`(即当前图片元素)的`src`属性来处理错误。 总结来说,`onerror`事件是JavaScript中不可或缺的错误处理机制,它允许开发者对脚本和...

    JavaScript通过使用onerror设置默认图像显示代替alt

    为了改善这一情况,可以通过JavaScript的onerror事件处理机制来设置当图片加载失败时显示一个默认的图像,从而提高网页的整体体验。 在HTML中,&lt;img&gt;标签用于嵌入图片。一个典型的&lt;img&gt;标签包括宽度、高度和图片源...

    用Javascript判断图片是否存在,不存在则显示默认图片的代码

    在Web开发中,图片的加载...通过监听`&lt;img&gt;`标签的`onerror`事件,或使用JavaScript发起HTTP请求并检查响应状态码,我们可以有效地检测图片是否存在,并采取相应的措施,比如显示一张默认图片,来优化用户的浏览体验。

    微信小程序 image组件binderror使用例子与js中的onerror区别

    当图片无法加载时,即发生404错误时,onerror事件会被触发,然后执行定义在onerror属性中的JavaScript代码。通常在onerror事件中,将出错的图片地址更换为一个默认的图片地址,这样用户界面不会显示错误信息,用户...

    js监听某张图片是否加载完成,完成后再执行相应代码

    总结一下,JavaScript中监听图片加载的关键在于使用`Image`对象的`onload`和`onerror`事件。通过这些事件,我们可以在图片加载的正确或错误状态时执行相应的处理逻辑。这种技术在网页开发中非常常见,对于优化页面...

    javascript 获取图像信息

    在本例中,为`&lt;img&gt;`元素添加了`onreadystatechange`和`onerror`事件处理程序。 ```javascript img.attachEvent("onreadystatechange", orsc); img.attachEvent("onerror", oe); ``` #### 4. `document.body....

    js的image onload事件使用遇到的问题

    4. onerror事件:除了onload事件外,Image对象还有一个onerror事件,该事件会在图片无法加载时触发。这对于处理图片加载错误情况非常有用。 5. 异步加载图片:在处理大量图片或者需要高效加载的页面时,开发者常常...

    js 点击自增图片

    对于图片加载,可以使用`onerror`事件来捕获并处理错误: ```javascript imgElement.onerror = function() { imgElement.src = 'fallback.jpg'; // 当图片加载失败时,显示备用图片 }; ``` 另外,如果图片是从...

    HTML 图片不存在则显示一个默认图片

    在这个示例中,如果`original-image-url`的图片加载失败,`onerror`事件就会触发,执行JavaScript代码将`src`属性更改为`default-image-url`,从而显示默认图片。同时,`this.onerror=null;`是为了防止事件无限循环...

    IE9浏览器下 使用JS获取图片尺寸大小 的方法

    如果图片加载失败(`onerror`事件触发),则会打印出错误消息。 这个方法在IE9及其他现代浏览器中都是有效的,确保了在获取图片尺寸前图片已经完全加载。如果你的应用场景需要跨多个浏览器,记得进行适当的浏览器...

    JAVASCRIPT显示图片的案例

    imgElement.onerror = function() { console.error('图片加载失败'); }; ``` 对于批量处理多个图片,可以使用循环结构: ```javascript var images = document.querySelectorAll('.imageClass'); for (var i = 0;...

    img.readyState!= complete 权限问题 也是一个无用题

    对于前端开发者来说,可以使用`img.onerror`事件处理错误,并给出友好的提示信息,或者采用预加载策略,确保关键图片在用户看到页面之前就已经加载完毕。 总结来说,这个博客文章和相关文件可能讨论了在Web开发中...

    JS图片预览(兼容IE6、IE7、IE8和FF)

    5. 注意点:对于IE浏览器,需要特别处理`onerror`事件,因为IE6-8在图片加载失败时不会触发`onerror`,而是直接忽略。可以设置一个超时机制,如果在一定时间内图片未加载完成,则显示错误提示。 此外,为了在Fire...

    图片预加载js

    图片预加载技术是Web开发中的一个重要概念,尤其是在处理大量图像或者多媒体内容的网站时,能够显著提升用户体验。本文将深入探讨“图片预加载js”这一主题,包括预加载的原理、实现方式以及如何使用JavaScript来...

Global site tag (gtag.js) - Google Analytics