Node.js는 이미지가 로드되었는지 확인하고 image_javascript 기술의 사전 다운로드를 구현합니다.
- WBOY원래의
- 2016-05-16 16:39:282052검색
이미지 객체를 생성하여 이미지를 미리 다운로드합니다. 이미지가 이미 브라우저 캐시에 있는 경우 콜백 함수를 직접 호출하고 onload 이벤트를 사용하여 이미지가 로드되었는지 확인합니다.
function loadImage(url, callback) {
var img = new Image(); //创建一个Image对象，实现图片的预下载
img.src = url;
if(img.complete) { // 如果图片已经存在于浏览器缓存，直接调用回调函数
callback.call(img);
return; // 直接返回，不用再处理onload事件
}
img.onload = function () { //图片下载完毕时异步调用callback函数。
callback.call(img);//将回调函数的this替换为Image对象
};
};
<pre name="code" class="html"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>判断图片是否加载完成</title>
</head>
<body>
<img id="img2" src="images/1.jpg" />
</body>
</html>
<script language="JavaScript">
document.getElementById("img2").onload = function () {
alert("图片加载已完成");
}
</script>
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.