img 加载网络图片失败 显示默认图片的方法

1. 概述

当从网络加载图片失败 希望显示默认图

img 标签有个 onerror属性

2. 代码

2.1 java服务端组织标签整个返回前端

String imgUrl = "javascript:this.src=\'http://172.21.96.31:88/k/default.jpg\'";
digest += "<img src='" + thumbnail + "' width='85px' height='70px' onerror=\""+imgUrl+"\">";

2.2 前端组织标签

var imgPath = "javascript:this.src=\'http://172.21.96.31:88/k/default.jpg\'";
_digest += '<div style="width:85px;height:70px;padding-left:0px;">';
_digest += '<img src="' + streamuri + '/keyframes/' + mmoId + '/char.JPG" onerror="'+imgPath+'" width="85px" height="70px">';
_digest += '</div>';

2.3 说明

主要的问题是特殊字符'(单引号)或"(双引号)的转义问题

以上这篇img 加载网络图片失败 显示默认图片的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • img 加载网络图片失败 显示默认图片的方法

    1. 概述 当从网络加载图片失败 希望显示默认图 img 标签有个 onerror属性 2. 代码 2.1 java服务端组织标签整个返回前端 String imgUrl = "javascript:this.src=\'http://172.21.96.31:88/k/default.jpg\'"; digest += "<img src='" + thumbnail + "' width='85px' height='70px' onerror=

  • Android 使用Picasso加载网络图片等比例缩放的实现方法

    在做android图片加载的时候,由于手机屏幕受限,很多大图加载过来的时候,我们要求等比例缩放,比如按照固定的宽度,等比例缩放高度,使得图片的尺寸比例得到相应的缩放,但图片没有变形.显然按照android:scaleType不能实现,因为会有很多限制,所以必须要自己写算法. 通过Picasso来缩放 其实picasso提供了这样的方法.具体是显示Transformation 的 transform 方法. (1) 先获取网络或本地图片的宽高 (2) 获取需要的目标宽 (3) 按比例得到目标的高度

  • vue中当图片地址无效的时候,显示默认图片的方法

    web项目中经常需要展示图片,很可能就会碰到图片地址无效的情况,比如图片地址不对,或者后台拿到图片地址后,该地址无效,或者数据库中没有该图片等情况.这时候,图片就会显示一个叉. 对于项目中出现的这种情况,我们也可以不做处理,但是比较影响美观,所以我们都会使用一个默认的图片来代替图片原来的地址. <img :src="item.img" @error="imgError(item)" /> 给图片添加一个error校验,当图片加载失效的时候,就会调用该属性

  • Android 使用Glide加载网络图片等比例缩放的实现方法

    在做android图片加载的时候,由于手机屏幕受限,很多大图加载过来的时候,我们要求等比例缩放,比如按照固定的宽度,等比例缩放高度,使得图片的尺寸比例得到相应的缩放,但图片没有变形.显然按照android:scaleType不能实现,因为会有很多限制,所以必须要自己写算法. 通过Glide来缩放 其实glide提供了这样的方法.具体是显示继承Transformation 的 setResource 方法. (1) 先获取网络或本地图片的宽高 (2) 获取需要的目标宽 (3) 按比例得到目标的高度

  • AngularJS使用ng-inlude指令加载页面失败的原因与解决方法

    本文实例讲述了AngularJS使用ng-inlude指令加载页面失败的原因与解决方法.分享给大家供大家参考,具体如下: AngularJS中提供的ng-include指令,很类似于JSP中的<jsp:include>用来将多个子页面合并到同一个父页面中,避免父页面过大,可读性差,不好维护. 父页面parent.html代码如下: <html> <head> <script src="angular-1.2.2/angular.js">&

  • Afianl框架里面的FinalBitmap加载网络图片

    Afinal里面FinalBitmap:用于显示bitmap图片,而无需考虑线程并发和oom等问题. 1.测试请求 使用网页打开http://avatar.csdn.net/C/6/8/1_bz419927089.jpg"可以看到一张图片. 2.新建FinalBitmap对象 FinalBitmap bitmap = FinalBitmap.create(this); 3.设置图片的uri地址 String uri = "http://avatar.csdn.net/C/6/8/1_b

  • vue图片加载与显示默认图片实例代码

    本文实例为大家分享了vue图片加载与显示默认图片的具体代码,供大家参考,具体内容如下 HTML: <div class="content-show-img"> <div class="show-img"> <img class="default-image" :src="data.image" @load="successLoadImg" @error="errorL

  • jQuery图片加载失败替换默认图片方法汇总

    本文主要讨论页面中图片加载失败后替换默认图片的几种方式 重点来了:一定要记住error事件不冒泡. 相关的知识点:jquery的ready方法.$("img").error().img的complete属性.插件imagesLoaded.事件委托.事件捕获和图片预加载的方法等 1. 图片加载失败替换为默认图片 1.1 给图片绑定error事件 当图片加载失败时会触发error事件 $("img").on("error", function ()

  • 微信小程序图片加载失败时替换为默认图片的方法

    微信小程序图片加载失败时替换为默认图片的方法

    先看一下效果图: 1.第一种情况:单独加载一个图片 index.wxml代码: <image class="userinfo-avatar" src="{{avatar}}" binderror="errorFunction"></image> index.js代码: errorFunction: function(){ this.setData({ avatar: '/image/default.png' }) } 2.

  • Android开发中ImageLoder加载网络图片时将图片设置为ImageView背景的方法

    本文实例讲述了Android开发中ImageLoder加载网络图片时将图片设置为ImageView背景的方法.分享给大家供大家参考,具体如下: 最近开始接触到android的开发,在开发中使用ImageLoder加载网络图片,但是框架加载的图片默认是通过ImageView的src属性设置,所以在某些场合是不符合需求,比如通过设置src在某些场景下是不能填充满整个ImageView,但是通过设置背景就可以实现,而框架并没有提供将图片设置为背景的方法,我在网上找了半天也看到了一些解决方案,但不是我想

随机推荐