沃梦达 / 编程技术 / CMS教程 / 正文

网站图片丢失或者获取失败时显示默认图片的办法

当我们的网站时间久了难免会出现图片丢失或者误删,这样文章的图片就无法显示了,会让页面变的很难看。那么当网站图片丢失或者获取失败时如何显示我们设置的默认图片呢,或者默认多张图片随机显示呢。 方法一:当图片调用失败后,会

当我们的网站时间久了难免会出现图片丢失或者误删,这样文章的图片就无法显示了,会让页面变的很难看。那么当网站图片丢失或者获取失败时如何显示我们设置的默认图片呢,或者默认多张图片随机显示呢。

方法一:当图片调用失败后,会用图片后面设置的默认图片顶上

<img src="pic/logo2009Blu.gif" onerror="this.src='/pic/default.gif'"> 
方法二:使用js方法当文章中的图片出错时就显示代码中设置的默认图片
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function () {
  $("img").error(function () {
            $(this).attr("src", "http:/www.xxx.com/uploads/img/soulution/2.jpg");
        });
 
 });
</script>
方法三:站图片丢失或者获取失败时多张默认图片随机显示:
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function () {
  $("img").error(function () {
    var x = 6;     
    var y = 1;     
    var rand = parseInt(Math.random() * (x - y + 1) + y);  
    var url = 'http://www.xxxx.com/uploads/img/soulution/'+rand+'.jpg'
    $(this).attr("src", url);
    });
 
 });
</script>
 

本文标题为:网站图片丢失或者获取失败时显示默认图片的办法

基础教程推荐