如果没有找到图像,如何防止显示图像占位符
How to prevent the display of image placeholder if the image is not found?
如果没有找到图像,是否有办法不显示图像占位符?我已经通过自动馈送加载了图像,并且对于一些项目图像在那里,但对于一些没有。因此,如果图像不在那里,我想显示一个自定义占位符。
我在这里找到了答案
这段代码工作得很好!
function onImgErrorSmall(source)
{
source.src = "/images/no-image-100px.gif";
// disable onerror to prevent endless loop
source.onerror = "";
return true;
}
然后像这样调用它:
<img src="/images/19013_small.jpg" alt="" onerror="onImgErrorSmall(this)" />
try this:
var tester=new Image()
tester.onload=function() {createPlaceHolderForImage(); }
tester.onerror=function() {handleError(); }
tester.src="http://www.temp.com/image.jpg"
如果图像存在,则调用onload函数,否则调用handleError
下面是一个使用jQuery的示例,这也可以在JavaScript中完成:
<script type="text/javascript">
$(document).ready(function(){
$("img").each(function(){
var imgObj = $(this);
var img = new Image();
img.onerror=function(){ imgObj.attr('src','placeholder.gif'); }
img.src = imgObj.attr('src');
});
});
</script>
<ul>
<li><img src="blah.gif" /></li>
<li><img src="blah.png" /></li>
<li><img src="http://www.google.com/intl/en_com/images/srpr/logo2w.png" /></li>
</ul>
此代码将遍历每个图像并检查它是否存在。如果不存在,则将其替换为'placeholder.gif'图像。
相关文章:
- 非常大的图像显示渐进
- CSS Html使图像显示在单选按钮的选项上(单选按钮被CSS隐藏)
- JS照片库.使大图像显示和缩略图可单击
- 多个图像显示带有动态创建的画布的最后一个图像并分配给图像
- 当我在jquery/javascript中单击按钮时加载图像显示
- React图像显示
- 随机图像显示,无重复,使用Javascript
- 将跨度内容(图像url)转换为图像(显示)
- 随机图像显示不止一次
- 节点.js 使用 Multer 上传图像显示未定义
- 范围滑块,用于更改轨道上方对齐圆的直径并使对齐的图像显示在下方
- 使用图像显示和隐藏
- 使用 JavaScript 将文件夹中的图库图像显示到网页中
- 画布到图像显示为无图像(空白)
- 传单不会将本地图像显示为叠加
- 切换此元素时,如何使不同的图像显示,而不是文本
- 在页面加载时将图像显示为弹出窗口
- 如何在模糊浏览器主窗口时将图像显示为叠加层
- iOS在画布上绘制图像显示:无会导致内存泄漏
- JavaScript 图像显示不起作用