Rumah > hujung hadapan web > tutorial js > Bagaimanakah Saya Boleh Menggantikan Imej Patah dengan jQuery atau JavaScript?

Bagaimanakah Saya Boleh Menggantikan Imej Patah dengan jQuery atau JavaScript?

DDD
Lepaskan: 2024-12-26 07:35:12
asal
709 orang telah melayarinya

How Can I Replace Broken Images with jQuery or JavaScript?

Menggantikan Imej Rosak dengan jQuery atau JavaScript

Halaman web sering bergantung pada imej dan adalah penting untuk mengendalikan situasi apabila imej menjadi tidak tersedia dan imej yang rosak muncul. Artikel ini meneroka dua kaedah untuk menangani isu ini: menggunakan perpustakaan jQuery dan penyelesaian JavaScript tulen.

Pendekatan jQuery

Walaupun pada mulanya dipertimbangkan untuk tugas ini, pendekatan jQuery terbukti kurang jelas. Untuk menggunakan jQuery untuk tujuan ini, anda perlu:

  • Dapatkan set imej menggunakan jQuery's $().
  • Gunakan kaedah .filter() untuk menapis imej yang rosak.
  • Ganti src imej yang rosak menggunakan .attr().

Penyelesaian JavaScript Tulen

Pendekatan alternatif menggunakan JavaScript tulen adalah lebih mudah dan lebih cekap. Dengan mengendalikan acara onError untuk imej, anda boleh menetapkan semula sumbernya:

function imgError(image) {
    image.onerror = "";
    image.src = "/images/noimage.gif";
    return true;
}
Salin selepas log masuk
<img src="image.png" onError="imgError(this);" />
Salin selepas log masuk

Sebagai alternatif, anda boleh melaksanakan ini tanpa fungsi:

<img src="image.png" onError="this.onerror=null;this.src='/images/noimage.gif';" />
Salin selepas log masuk

Keserasian Pertimbangan

Adalah penting untuk ambil perhatian bahawa sokongan penyemak imbas untuk kemudahan ralat mungkin berbeza-beza. Untuk butiran keserasian, rujuk rujukan yang disediakan dalam jawapan asal: http://www.quirksmode.org/dom/events/error.html

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggantikan Imej Patah dengan 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