Génération de BackgroundImage en boucle
Bonjour à tous,
J'ai un script qui génère à la volée des DIV avec background en récupérant l'information en AJAX.
Le problème étant que le background n'est repris que dans la première itération, mais pas dans les suivantes.
Je n'ai pourtant pas d'erreur retournée dans le débugueur, et les valeurs sont bien reprises individuellement dans le code.
Mais celui-ci refuse pourtant d'afficher le backgroundImage.
Pourriez-vous m'apporter vos lumière à ce sujet svp ? :D
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
| var dossier = "images";
let maliste = "";
function ajax(adresse) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
//return xhr.responseText;
maliste = xhr.responseText;
reste();
}
};
xhr.open("GET", adresse, true);
xhr.send(null);
}
// Création
const newImage = document.createElement("div");
newImage.id = "imgp";
newImage.style.position = "relative";
var divInit = document.getElementById("img_test");
divInit.replaceWith(newImage);
ajax("script.php?dossier="+dossier);
// Retour
function reste() {
let fond = maliste.split('//');
var longueurListe = liste.length;
for (let ligne = 0; ligne < longueurListe; ligne++) {
const newDiv = document.createElement("div");
newDiv.id = "newDiv"+ligne;
newDiv.style.height = "200px";
newDiv.style.width = "200px";
newDiv.style.backgroundImage = "url("+dossier+"/"+fond+".jpg)";
newImage.appendChild(newDiv);
}
} |
--------------------------------------
Mise à jour : solution trouvée. Le problème venait du fichier txt qui avait un retour de ligne "\n". Il était dont pris en compte dans le split et mettait la valeur en erreur. :D
