Rumah > hujung hadapan web > tutorial js > Bagaimanakah Saya Boleh Mengendalikan Imej Rosak dengan Cekap dalam Halaman Web Saya Menggunakan jQuery atau JavaScript?

Bagaimanakah Saya Boleh Mengendalikan Imej Rosak dengan Cekap dalam Halaman Web Saya Menggunakan jQuery atau JavaScript?

DDD
Lepaskan: 2024-12-23 18:51:19
asal
504 orang telah melayarinya

How Can I Efficiently Handle Broken Images in My Web Pages Using jQuery or JavaScript?

Mengendalikan Imej Rosak dengan jQuery atau JavaScript

Masalah:
Halaman web dengan banyak imej mengalami kerosakan kejadian imej kerana tidak tersedia.

jQuery Pendekatan:

  1. Peroleh elemen imej: $("img").
  2. Tapis imej rosak: $brokenImages = $("img").filter(function( ) { kembalikan this.complete && !this.naturalWidth; imej: $brokenImages.attr("src", "/broken-image.png").
JavaScript onError Event:

Pendekatan alternatif melibatkan mengendalikan acara onError untuk setiap imej untuk menetapkan semula sumbernya secara langsung.

Tentukan pengendalian ralat imej fungsi:
function imgError(image) {
    image.onerror = "";
    image.src = "/images/noimage.gif";
    return true;
}
Salin selepas log masuk
Gunakan fungsi dalam HTML:
<img src="image.png" onerror="imgError(this);"/>
Salin selepas log masuk
Atau tanpa fungsi:
<img src="image.png" onError="this.onerror=null;this.src='/images/noimage.gif';" />
Salin selepas log masuk
Keserasian Pelayar:

Untuk pendekatan pengendalian acara onError, sila rujuk jadual keserasian di:

http://www.quirksmode.org/dom/events/error.html

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengendalikan Imej Rosak dengan Cekap dalam Halaman Web Saya Menggunakan jQuery atau JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan