图片:

失败:

// 方法 1:更换图片地址

$('img').error(function(){

$(this).attr('src', '加载失败.png');

});

// 方法 2:隐藏它

$("img").error(function(){

$(this).hide();

});

成功

//jquery的方式

$("#imageId").load(function(){

alert("加载完成!");

});

js:

document.getElementById("img2").onload=function(){}

视频:

h5的video标签 的oncanplaythrough方法可以判断视频加载成功与否

<a href="javascript:void(0)" title="点击查看视频">

<video id="${video.id}" src="${videoPath}${video.fFileName}" onclick="big(this.src);"

height=30 width=30 oncanplaythrough="myFunction(this.id)"/>

</a>

function myFunction(id) {

$("#"+id+"a").show();

}

img标签有个onerror方法可以直接判断图片是否加载成功:

为防止onerror方法死循环应该这么写:

<img alt="" xid="image1" src="xxxx" onerror="this.onerror=null;this.src='./knowledge/DefaultNews.png'"></img></div>

js 判断图片和视频是否加载成功的更多相关文章

  1. JS判断单、多张图片加载完成

    转:http://www.daqianduan.com/6419.html 试想,如果模板中有图片,此时如何判断图片是否加载完成? 在此之前来了解一下jquery的ready与window.onloa ...

  2. js-页面需展示大量图片时,采用lyz.delayLoading.min.js,图片在屏幕时加载显示

    本文本内容拷贝至:https://blog.csdn.net/xuanwuziyou/article/details/48199123 当一个网页中有大量图片时,浏览器会逐个去下载这些图片,等全部下载 ...

  3. swiper.js 多图片页面的懒加载lazyLoading

    swiper.js官网:http://www.swiper.com.cn/api/Images/2015/0308/213.html 设为true开启图片延迟加载,使preloadImages无效.需 ...

  4. JS判断当前DOM树是否加载完毕

    /** * @function Monitor whether the document tree is loaded. * @param fn */function domReady(fn) { i ...

  5. JS判断图片是否加载完成三种方式

    1.img的complete属性 轮询不断监测img的complete属性,如果为true则表明图片已经加载完毕,停止轮询.该属性所有浏览器都支持. <p id="p1"&g ...

  6. 页面滚动图片等元素动态加载插件jquery.scrollLoading.js

    如果一个网页很长,那么该页面的加载时间也会相应的较长.而这里给大家介绍的这个jQuery插件scrollLoading的作用则是,对页面元素进行动态加载,通俗的说就是滚到哪就加载到哪,屏幕以下看不见的 ...

  7. 判断img图片是否加载成功

    上班之余,记录一下工作中遇到的有趣问题... 事情是这样的...在做一个内嵌H5的app时,有一个“个人名片”页面...要求:如果后台接口有给头像的图片链接就用他们给的,如果没给,前端给个默认头像.. ...

  8. 《前端之路》之 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏

    目录 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & ...

  9. js实现类型jq的dom加载完成

    有时候我们只想在 dom 加载完成后运行 js ,而不是等所有图片加载完成.所以不需要 onload , onload 会加载图片等其他媒体.很消耗时间. 原:http://blog.csdn.net ...

随机推荐

  1. 微信小程序_(视图)简单的swiper容器

    swiper容器效果 官方文档:传送门 swiper容器可实现简单的轮播图效果 结构程序 Page({ /** * 页面的初始数据 */ data: { }, /** * 生命周期函数--监听页面加载 ...

  2. Java 内部类、成员类、局部类、匿名类等

    Java各种称呼类详解 Java有各种各样类,内部类.嵌套类.成员类.局部类(本地类).静态类.匿名类.文件类以及这些组合起来的称呼类,成员内部类,成员匿名类,成员嵌套类,本地匿名类等,真是多的不行, ...

  3. JS基础_Null和Undefind

    1.Null Null类型的值只有一个值,就是null null专门用来表示一个为空的对象 var a=null; console.log(a);//nulltypeof a //object 2.U ...

  4. LeetCode 46. 全排列(Permutations)

    题目描述 给定一个没有重复数字的序列,返回其所有可能的全排列. 示例: 输入: [1,2,3] 输出: [ [1,2,3], [1,3,2], [2,1,3], [2,3,1], [3,1,2], [ ...

  5. 数组 Kotlin(5)

    数组 数组在 Kotlin 中使用 Array 类来表示,它定义了 get 和 set 函数(按照运算符重载约定这会转变为 [] ) 和 size 属性,以及一些其他有用的成员函数:基本类型 clas ...

  6. cucumber+selenium

    工程结构 pom <?xml version="1.0" encoding="UTF-8"?> <project xmlns="ht ...

  7. 2.进行model和log的路径创建

    第一步:使用datetime.strftime(datetime.now(), '%Y%m%d-%H%M%S') 用于生成当前时间 第二步: 使用os.path.join() 将文件的路径与subdi ...

  8. 浅谈Manacher算法

    Manacher manacher是一种\(O(n)\)求最长回文子串的算法,俗称马拉车(滑稽) 直接步入正题 首先可以知道的是:每一个回文串都有自己的对称中心,相应的也有自己的最大延伸长度(可以称之 ...

  9. python - yeild

    带有yield的函数不仅仅只用于for循环中,而且可用于某个函数的参数,只要这个函数的参数允许迭代参数.比如array.extend函数,它的原型是array.extend(iterable). 带有 ...

  10. OpenvSwitch/OpenFlow 架构解析与实践案例

    目录 文章目录 目录 前言 软件定义网络(SDN) 虚拟交换机(vSwitch) 为什么说云计算时代的 SDN 非常重要 OpenFlow 简介 Open vSwitch Open vSwitch 的 ...