C’è un modo per restituire una lista di tutti i nomi dei file immagine da una cartella usando solo Javascript?

Voglio visualizzare tutte le immagini dalla cartella che si trova nel server nella galleria di immagini.

C’è un modo per restituire un elenco di tutti i nomi dei file immagine da una cartella utilizzando solo JavaScript o JQuery?

Inoltre voglio contare il numero di file immagine in una cartella simile usando solo JavaScript.

C’è un modo per contare il numero di file immagine da una cartella usando solo JavaScript?

No, non puoi farlo usando Javascript da solo. Javascript sul lato client non può leggere il contenuto di una directory nel modo in cui penso tu stia chiedendo.

Tuttavia, se sei in grado di aggiungere una pagina indice (o configurare il tuo server web per mostrare una pagina indice) per la directory images e stai servendo il Javascript dallo stesso server, allora potresti fare una chiamata AJAX per recuperare il indice e quindi analizzarlo.

vale a dire

1) Abilita gli indici in Apache per la directory pertinente su yoursite.com:

http://www.cyberciti.biz/faq/enabling-apache-file-directory-indexing/

2) Poi recupera / analizza con jQuery. Dovrai calcolare il modo migliore per grattare la pagina e c’è quasi certamente un modo più efficiente di recuperare l’intero elenco, ma un esempio:

$.ajax({ url: "http://yoursite.com/images/", success: function(data){ $(data).find("td > a").each(function(){ // will loop through alert("Found a file: " + $(this).attr("href")); }); } }); 

Questo elencherà tutti i file jpg nella cartella che hai definito in url: e li aggiungerà a un div come un paragrafo. Può farlo anche con ul li .

 $.ajax({ url: "YOUR FOLDER", success: function(data){ $(data).find("a:contains(.jpg)").each(function(){ // will loop through var images = $(this).attr("href"); $('

').html(images).appendTo('a div of your choice') }); } });

No. JavaScript è una tecnologia lato client e non può fare nulla sul server. È comunque ansible utilizzare AJAX per chiamare uno script sul lato server (ad es. PHP) che potrebbe restituire le informazioni necessarie.

Se si desidera utilizzare AJAX, il modo più semplice sarà utilizzare jQuery:

 $.post("someScript.php", function(data) { console.log(data); //"data" contains whatever someScript.php returned }); 

Anche se è ansible eseguire comandi FTP utilizzando WebSockets, la soluzione più semplice è elencare i file utilizzando opendir sul lato server ( PHP ) e “sputandoli” nel codice sorgente HTML, quindi sarà disponibile sul lato client.

Il seguente codice farà proprio questo,

Opzionalmente –

  • usa il tag per presentare un link.
  • query per ulteriori informazioni utilizzando lato server ( PHP ),

    ad esempio una dimensione del file ,

PHP filesize SUGGERIMENTO : inoltre è ansible superare facilmente il limite di 2 GB del file PHP utilizzando: AJAX + HEAD request + .htaccess rule per consentire l’accesso Content-Length dal lato client.

  • Un esempio pienamente funzionante può essere trovato nel mio repository github: download.eladkarako.com

  • Di seguito è riportato un esempio semplificato (semplificato):

         

Il risultato DOM sarà simile a questo:

         

Molti trucchi funzionano, ma la richiesta Ajax divide il nome del file a 19 caratteri? Guarda l’output della richiesta Ajax per vedere che:

Il nome del file va bene nell’attributo href, ma $(this).attr("href") usa il testo del nome del file diviso

Quindi $(data).find("a:contains(.jpg)") non è in grado di rilevare l’estensione.

Spero che questo sia utile

IMHO, l’idea di Edizkan Adil Ata è in realtà il modo più appropriato. Estrae gli URL dei tag di ancoraggio e li inserisce in un tag diverso. E se non vuoi lasciare che le ancore siano viste dal visitatore della pagina, basta semplicemente .hide() tutte con JQuery o display: none; in CSS.

Inoltre puoi eseguire il prefetching, come questo:

  

In questo modo non devi nasconderlo e puoi comunque estrarre il percorso dell’immagine.