Bagaimana untuk Memuatkan Imej dari Folder ke Halaman Web Anda dengan jQuery/Javascript?

Memuatkan Imej daripada Folder ke Halaman Web dengan jQuery/Javascript

Untuk memuatkan imej daripada folder bernama "imej" ke dalam halaman HTML , anda boleh menggunakan JavaScript atau jQuery. Walaupun nama imej bukan nombor berjujukan, ada penyelesaiannya.

Penyelesaian:

<code class="js">var folder = "images/";

$.ajax({
    url : folder,
    success: function (data) {
        $(data).find("a").attr("href", function (i, val) {
            if( val.match(/\.(jpe?g|png|gif)$/) ) { 
                $("body").append( "<img src='"+ folder + val +"'>" );
            } 
        });
    }
});</code>

Penjelasan:

• Baris 1: Mentakrifkan laluan folder relatif kepada fail .js anda.
• Baris 3-8: Menggunakan fungsi $.ajax() jQuery untuk memuatkan kandungan folder. Apabila berjaya, ia menghuraikan respons HTML menggunakan $(data).
• Baris 6-7: Mengesan teg sauh () dengan href yang sepadan dengan sambungan fail imej menggunakan biasa ungkapan.
• Baris 8: Menambah tag pada halaman untuk setiap fail imej yang dipadankan.

Pertimbangan:

• Pelayan Apache: Dayakan "Indeks Pilihan" atau gunakan pakej seperti "serve-index" untuk Express.js untuk membenarkan penyenaraian direktori.
• Pelayan Node.js: Gunakan kod berikut untuk mendayakan penyenaraian folder:

<code class="js">app.use('/images', serveIndex(path.join(__dirname, '/images')));</code>

Dengan menggunakan pendekatan ini, anda boleh memuatkan semua imej daripada folder "imej" anda dengan mudah ke halaman web anda, tanpa mengira nama mereka.

Atas ialah kandungan terperinci Bagaimana untuk Memuatkan Imej dari Folder ke Halaman Web Anda dengan jQuery/Javascript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!