في بعض الأحيان تحتاج إلى الحصول على حجم الصورة ، والتي يجب تحميلها فقط بعد تحميل الصورة. ابحث عن الطريقة؟
1. الحدث الحمل
نسخة الكود كما يلي:
<! doctype html>
<html>
<head>
<meta charset = "utf-8">
<title> IMG - LOAD EVENT </TITLE>
</head>
<body>
<img id = "img1" src = "http://pic1.xxx.com/wall/f/51c3bb99a21ea.jpg">
<p id = "p1"> التحميل ... </p>
<script type = "text/javaScript">
img1.onload = function () {
p1.innerhtml = 'loaded'
}
</script>
</body>
</html>
اختبار ، تُظهر جميع المتصفحات "محملة" ، مما يشير إلى أن جميع المتصفحات تدعم حدث تحميل IMG.
2. ReadyStateChange حدث
نسخة الكود كما يلي:
<! doctype html>
<html>
<head>
<meta charset = "utf-8">
<title> IMG - حدث ReadyStateChange </title>
</head>
<body>
<img id = "img1" src = "http://pic1.xxx.com/wall/f/51c3bb99a21ea.jpg">
<p id = "p1"> التحميل ... </p>
<script type = "text/javaScript">
IMG1.OnReadyStateChange = function () {
if (img1.ReadyState == "كاملة" || img1.ReadyState == "تحميل") {
p1.innerhtml = 'ReadyStateChange: محمّل'
}
}
</script>
</body>
</html>
ReadyState كاملة وتحميلها ، مما يعني أنه تم تحميل الصورة. اختبار أن IE6-IE10 يدعم هذا الحدث ، لكن المتصفحات الأخرى لا تفعل ذلك.
ثالثا. سمة IMG الكاملة
نسخة الكود كما يلي:
<! doctype html>
<html>
<head>
<meta charset = "utf-8">
<title> IMG - سمة كاملة </title>
</head>
<body>
<img id = "img1" src = "http://pic1.xxx.com/wall/f/51c3bb99a21ea.jpg">
<p id = "p1"> التحميل ... </p>
<script type = "text/javaScript">
وظيفة imgload (IMG ، رد الاتصال) {
var timer = setInterval (function () {
if (img.complete) {
رد الاتصال (IMG)
Clearinterval (مؤقت)
}
} ، 50)
}
imgload (img1 ، function () {
p1.innerhtml ('Loaded')
})
</script>
</body>
</html>
يراقب الاقتراع باستمرار السمة الكاملة لـ IMG. إذا كان هذا صحيحًا ، فهذا يعني أنه تم تحميل الصورة وتوقف الاقتراع. هذه الخاصية مدعومة من قبل جميع المتصفحات.