Erreur de chargement d'un script

Version imprimable

18/07/2018, 09h59
Asdorve

Erreur de chargement d'un script
bonjour,

Je suis en train d'implémenter sur mon site ceci:
https://www.w3schools.com/howto/tryi...ss_js_lightbox

Cependant, toute la partie php est appelée via une requête ajax.

Mon problème est le suivant: j'ai une erreur d'execution

Citation:

Uncaught TypeError: Cannot read property 'style' of undefined at showSlides

pour le code suivant:

Code:

slides[i].style.display = 'none';

Lorsque je clique sur une des images, j'ai l'erreur suivante:

Citation:

Uncaught TypeError: Cannot read property 'style' of undefined
at showSlides (index.php:275)
at currentSlide (index.php:261)
at HTMLImageElement.onclick (index.php:1)

qui correspond à:
Code:

1 2 3 4 slides[i].style.display = 'none'; showSlides(slideIndex = n); openModal(); currentSlide(1);
J'ai l'impression que le script appelé en fin de page ne tient pas compte des éléments chargés.

Est-ce bien ça? Dans tout les cas, comment je peux corriger ce problème?

Merci d'avance
18/07/2018, 11h22
SpaceFrog

tu es bien dans le callback de l'ajax ?

Non, je suis juste avant la balise body.

Mais j'ai testé de déplacer ce script ailleurs, mais sans succès.

Voici mon code

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
 $.post(
            'article.php', // Le fichier cible côté serveur.
            {
                code : $("#code").val(),
                cc : $("#cc").val() ,
 
 
            },
            nom_fonction_retour, // Nous renseignons uniquement le nom de la fonction de retour.
            'text'  // Format des données reçues.
 
        );

C'est ici que je dois placer mon script suivant?

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
44
45
 
function openModal() {
	  document.getElementById('myModal').style.display = 'block';
	}
 
	function closeModal() {
	  document.getElementById('myModal').style.display = 'none';
	}
 
	alert ('ok');
 
	 var slideIndex = 1;
     showSlides(slideIndex);
 
 
function plusSlides(n) {
  showSlides(slideIndex += n);
}
 
function currentSlide(n) {
  showSlides(slideIndex = n);
}
 
 
function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName('mySlides');
  var dots = document.getElementsByClassName('demo');
  var captionText = document.getElementById('caption');
 
 
  if (n > slides.length) {slideIndex = 1}
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i <= slides.length; i++) {
      slides[i].style.display = 'none';
  }
  for (i = 0; i <= dots.length; i++) {
      dots[i].className = dots[i].className.replace(' active', '');
  }
  alert(slideIndex);
 
  slides[slideIndex].style.display = ' block';
  dots[slideIndex].className += ' active';
  captionText.innerHTML = dots[slideIndex].alt;
}

18/07/2018, 15h47
SpaceFrog

ta fonction callback c'est nom_fonction_retour,
je ne la vois pas dans ton code ...

Je ne l'ai pas mise, mais elle y est.

Code:

1
2
3
4
5
6
7
 
function nom_fonction_retour(texte_recu){
    // Du code pour gérer le retour de l'appel AJAX.
    document.getElementById('return_comment').innerHTML = texte_recu;
 
 
}

19/07/2018, 08h16
SpaceFrog

tu as testé qu"'elle reçoit bien l'argument?
19/07/2018, 08h51
Asdorve

oui.

Mais je viens de m'apercevoir d'une chose, c'est qu'en changeant l'id de mes balises, ça fonctionne. Je dois avoir des id redondants avec une autre partie du code. :oops:

Merci en tout cas d'avoir pris le temps de me répondre.
19/07/2018, 09h18
SpaceFrog

En effet un id doit être unique sur la page.
Pour éviter les doublons d'id il est parfois utile d'utiliser un nommage rationnel des id avec des préfixes par destination...