Я пытаюсь отобразить изображения из 3 папок с именами FOLDER1, FOLDER2 и FOLDER3.Я пытаюсь использовать for loop для последовательного просмотра каждой папки и отображения каждого их содержимого в отдельных элементах div, классифицированных под соответствующими именами папок.Но код, который у меня есть, не может этого сделать.По какой-то причине цикл for проходит только через папку FOLDER3 и полностью пропускает FOLDER1 и FOLDER2, несмотря на то, что имена файлов содержимого из FOLDER1 и FOLDER2 отображаются как поврежденные изображения (что так запутанно)!Может быть, мне не хватает строки, которую я должен добавить к своему AJAX-коду, чтобы он работал?
ЭТО результат, который я хотел бы достичь:
FOLDER1
images/FOLDER1/folder1_img.jpg
FOLDER2
images/FOLDER2/folder2_img.jpg
FOLDER3
images/FOLDER3/folder3_img.jpg
НО - ЭТО результат, который я в настоящее время имею:
FOLDER1
images/FOLDER3/folder1_img.jpg
FOLDER2
images/FOLDER3/folder2_img.jpg
FOLDER3
images/FOLDER3/folder3_img.jpg
Это мой полный код:
HTML-скрипт:
<!DOCTYPE html>
<html>
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous">
</script>
<body>
<div class="wflex">
<div class="wscdfx">
<?php $items = array("FOLDER1", "FOLDER2", "FOLDER3"); ?>
<?php foreach ($items as $item): ?>
<div class="spct"><?php echo "$item"; ?></div>
<div class="prodfx"></div>
<?php endforeach; ?>
</div>
</div>
</body>
</html>
AJAX-скрипт:
<script>
for (n = 1; n < 4; n++) {
var folder = "images/FOLDER"+n+"/";
$.ajax({
url : folder,
success: function (data) {
$(data).find("a").attr("href", function (i, val) {
if( val.match(/\.(jpe?g|png|gif)$/) ) {
$(".prodfx").append( "<img src='"+ folder + val +"'>" );
}
});
}
});
}
</script>
Пожалуйста, если кто-то может помочь мне здесь, я был бы очень признателен,Спасибо