Rumah > hujung hadapan web > tutorial js > Bagaimana Saya Boleh Pramuat Imej Dengan Cepat Menggunakan jQuery?

Bagaimana Saya Boleh Pramuat Imej Dengan Cepat Menggunakan jQuery?

Patricia Arquette
Lepaskan: 2024-12-22 06:52:09
asal
413 orang telah melayarinya

How Can I Quickly Preload Images Using jQuery?

Memuat Pramuat Imej dengan jQuery: Panduan Pantas dan Mudah

Walaupun skrip pramuat imej yang kompleks tersedia, artikel ini menyediakan kaedah yang ringkas dan mudah pramuat imej menggunakan jQuery.

JQuery Kod

Coretan berikut menunjukkan cara yang mudah dan cekap untuk pramuat berbilang imej:

function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
        $('<img/>')[0].src = this;
        // Alternatively you could use:
        // (new Image()).src = this;
    });
}

// Usage:

preload([
    'img/imageName.jpg',
    'img/anotherOne.jpg',
    'img/blahblahblah.jpg'
]);
Salin selepas log masuk

Dalam kod ini, fungsi pramuat() mengambil tatasusunan laluan imej dan pramuat setiap imej dengan mencipta elemen dan menetapkan atribut srcnya kepada laluan imej. Sebagai alternatif, anda juga boleh menggunakan (Imej baharu()).src = ini untuk pramuat imej.

Pemalam jQuery Alternatif

Jika pendekatan pemalam diutamakan, coretan kod berikut menyediakan pemalam ringkas:

$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
}

// Usage:

$(['img1.jpg','img2.jpg','img3.jpg']).preload();
Salin selepas log masuk

Pemalam ini memanjangkan objek jQuery dan membolehkan anda untuk pramuat imej dengan memanggil kaedah pramuat() pada tatasusunan laluan imej.

Dengan kaedah ini, pramuat imej menjadi tugas yang cepat dan mudah, memastikan prestasi optimum untuk aplikasi web anda.

Atas ialah kandungan terperinci Bagaimana Saya Boleh Pramuat Imej Dengan Cepat Menggunakan jQuery?. 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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan