How to load all the images from one Directory

Question

i tried to display all images in one directory using following jquery. But it is not working. My folder structure is just a images folder and js folder. I just followed this question also, but couldnt achive the target.

< script >
  $(document).ready(function() {

    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 + "'>");
          }
        });
      }
    });
  }); < /script>

<!DOCTYPE html>
<html>

<head>
  <script src="js/jquery.min.js"></script>

</head>

<body>
</body>

</html>

@Satpal here i used Ajax request. and there are many acceptance of previous question i have link [here](http://stackoverflow.com/questions/18480550/how-to-load-all-the-images-from-one-of-my-folder-into-my-web-page-using-jquery) — Geeth Welagedara, Nov 03 '16 at 06:22

score 1 · Accepted Answer · answered Nov 03 '16 at 06:17

First of all you need to create a server page which will provide you list of names from that directory. you need to call that page (instead of folder name) from your $.ajax function.

Second, loop over that list of image names (paths) and create image elements. You are doing the similar stuff.

score -1 · Answer 2 · answered Nov 03 '16 at 06:13

-1

Javascript does not have access to file system. Alternatively you can send an ajax request to your server-scide script to list the file names and return the names back to your script OR you can use server side javascript

answered Nov 03 '16 at 06:13

shoieb0101

1,524
10
15

How to load all the images from one Directory

2 Answers2