js 判断图片和视频是否加载成功
图片:
失败:
// 方法 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 判断图片和视频是否加载成功的更多相关文章
- JS判断单、多张图片加载完成
转:http://www.daqianduan.com/6419.html 试想,如果模板中有图片,此时如何判断图片是否加载完成? 在此之前来了解一下jquery的ready与window.onloa ...
- js-页面需展示大量图片时,采用lyz.delayLoading.min.js,图片在屏幕时加载显示
本文本内容拷贝至:https://blog.csdn.net/xuanwuziyou/article/details/48199123 当一个网页中有大量图片时,浏览器会逐个去下载这些图片,等全部下载 ...
- swiper.js 多图片页面的懒加载lazyLoading
swiper.js官网:http://www.swiper.com.cn/api/Images/2015/0308/213.html 设为true开启图片延迟加载,使preloadImages无效.需 ...
- JS判断当前DOM树是否加载完毕
/** * @function Monitor whether the document tree is loaded. * @param fn */function domReady(fn) { i ...
- JS判断图片是否加载完成三种方式
1.img的complete属性 轮询不断监测img的complete属性,如果为true则表明图片已经加载完毕,停止轮询.该属性所有浏览器都支持. <p id="p1"&g ...
- 页面滚动图片等元素动态加载插件jquery.scrollLoading.js
如果一个网页很长,那么该页面的加载时间也会相应的较长.而这里给大家介绍的这个jQuery插件scrollLoading的作用则是,对页面元素进行动态加载,通俗的说就是滚到哪就加载到哪,屏幕以下看不见的 ...
- 判断img图片是否加载成功
上班之余,记录一下工作中遇到的有趣问题... 事情是这样的...在做一个内嵌H5的app时,有一个“个人名片”页面...要求:如果后台接口有给头像的图片链接就用他们给的,如果没给,前端给个默认头像.. ...
- 《前端之路》之 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏
目录 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & ...
- js实现类型jq的dom加载完成
有时候我们只想在 dom 加载完成后运行 js ,而不是等所有图片加载完成.所以不需要 onload , onload 会加载图片等其他媒体.很消耗时间. 原:http://blog.csdn.net ...
随机推荐
- 自动化框架Quantum Automation Framework+cucumber+perfecto
名词解释 Quantum: 一款基于JAVA的自动化框架,支持手机和桌面WEB的自动化测试.与cucumber和perfecto实现了整合,用于BDD自动化. Refer: http://projec ...
- T78748 【lcez模拟赛】机场Ⅰ
T78748 [lcez模拟赛]机场Ⅰ 其实这就是最小生成树的题辣 注意输入毒瘤 输入的话要避免记录中间这个‘ , ’ 如下操作可以解决 特别注意%d之间的‘ , ’ 边的权值要现算 存点的话存横纵坐 ...
- java 设计模式 单例模式之饿汉模式/懒汉模式 singleton pattern
https://v.qq.com/x/page/e0364ung5zp.html 讲的不错, 关于 饿汉式单例模式 code Student 类: package com.test;//单例模式之 ...
- Windows监控——性能指标详解(转)
http://blog.csdn.net/yiqin3399/article/details/51730106
- loadrunner设置Analysis分析时去掉思考时间
在进行对loadrunner进行执行脚本的情况下,那么就需要在脚本中进行添加为思考时间,这样才更符合人为的脚本时间,那么在进行执行压力的过程中,思考时间是需要开启的,完成之后为了便于分析那么就需要把思 ...
- 【图形学手记】law of the unconscious statistician
以扔色子为例,结果集为{1,2,3,4,5,6},每个数字出现的概率为1/6 以色子结果为随机变量X,如果我们定义函数F(X) = (X-3)2,我们来计算F(X)的概率分布: X=1,F(1)=(1 ...
- flutter详解路由栈(二)
前面,我们已经知道如何简单在路由栈中 push.pop 实例,然而,当遇到一些特殊的情况,这显然不能满足需求.学习 Android 的同学知道 Activity 的各种启动模式可以完成相应需求,Flu ...
- zabbix 4.0版本
Zabbix 4.0 最高版本是4.2 1.什么是zabbix及优缺点(对比cacti和nagios) zabbix能监视各种网络参数,保证服务器系统的安全运营:并提供灵活的通知机制以让系统管理员快速 ...
- WebLogic下Argument(s) "type" can't be null.
启动项目出现Argument(s) "type" can't be null.异常.异常如下: java.lang.IllegalArgumentException: Argume ...
- SpringMVC以POST提交表单中文乱码解决方案。
在web.xml中添加字符集过滤器: <filter> <filter-name>characterEncodingFilter</filter-name> < ...