Récupérer src d'un element enfant [Débutant(e)] [Résolu]

[lefebvresdesigns]

Bonjour,
j'ai un petit problème, je souhaite récupérer la la source (image) d'un élément enfant (je pense à lastChild) afin de la passer en paramètre d'url au clic.

fonction JavaScript :

Code :

1
2
3
4
5
6
7
 
<script type="text/javascript">
function Suppr_image () {
	document.getElementById("suppr-image").href = "suppr_image.php";
	document.getElementById("suppr-image").search = "?IDimage="+this.src;
}
</script>

php/html - (je dois récupérer le src de l'image quand j'ai cliqué sur le li parent (dans la liste captures-mini) :

Code html :

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
 
<div id="article-details">
                <div id="captures">
                  <div id="grande-capture">
                    <div class="center">
                      <img src="images/products/<?php echo $row_Recordset3['Image']; ?>" width="300" height="300" alt="<?php echo $row_Recordset2['Nom']; ?>" id="imagepcpale" style="margin-top:0px;" />
                    </div>
                    <div class="delete-capture">
                      <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('delete-capture-cross-1','','images/suppr-cross-hover.png',1)" id="suppr-image">retirer l'image <img src="images/suppr-cross.png" width="13" height="13" alt="supprimer l'image" id="delete-capture-cross-1" /></a>
                    </div>
                  </div>
                  <ul id="captures-mini">
                    <?php if ($totalRows_Recordset3 > 0) { ?>
                      <?php do { ?>
                    <li onclick="MM_swapImage('imagepcpale','','images/products/<?php echo $row_Recordset3['Image']; ?>',1);Suppr_image(this)">
                      <table width="80" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                          <td><img src="images/products/<?php echo $row_Recordset3['Image']; ?>" width="1366" height="768" alt="<?php echo $row_Recordset2['Nom']; ?>" /></td>
                        </tr>
                      </table>
                    </li>
                    <?php } while ($row_Recordset3 = mysql_fetch_assoc($Recordset3)); ?>
                    <?php } ?>
                    <?php if ($totalRows_Recordset3 < 5) { ?>
                    <li onclick = "document.getElementById('lightbox-uploader').style.display='block';document.getElementById('uploader').style.display='block'" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('icon-add-capture','','images/icone-add-capture-hover.png',1)">
                      <table width="80" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                          <td><img src="images/icone-add-capture.png" alt="Ajouter une image" name="icon-add-capture" width="30" height="30" border="0" id="icon-add-capture" /></td>
                        </tr>
                      </table>
                    </li>
                    <?php }?>
                  </ul>
                </div>

il me semble que le problème vient du fait que je n'ai pas spécifié l'élément enfant sur lequel j'allais chercher le src j'ai tenté avec lastChild sans y parvenir. Je remercie la communauté d'avance pour son soutien

[Bovino]

Quelle horreur !
Tu mets une table d'une seule cellule dans un <li>

Sinon, tu passes this en paramètre à l'appel de la fonction mais tu ne l'utilises pas dans la déclaration...

Bref,

Code :

this.getElementsByTagName('img')[0].src

devrait t'aider.

[lefebvresdesigns]

Désolé je débute en JavaScript. Par contre oui la table c'était pour centrer les images tout en gardant une échelle proportionnelle. Sinon j'aurais très bien pu le faire avec un div en display table-cell mais si mes souvenirs sont bons IE interprétait mal le code.

J'ai mis le mot this dans la fonction :

Code :

1
2
3
4
function Suppr_image () {
	document.getElementById("suppr-image").href = "suppr_image.php";
	document.getElementById("suppr-image").search = "?IDimage="+this.src;
}

J'ai essayé le code fourni mais cela ne marche pas. Je dois le mettre où ? Encore désolé, je débute, merci de votre coopération.

Code :

1
2
3
4
5
6
7
8
 
<script type="text/javascript">
function Suppr_image () {
	this.getElementById("suppr-image")[0].src;
	document.getElementById("suppr-image").href = "suppr_image.php";
	document.getElementById("suppr-image").search = "?IDimage="+this.src;
}
</script>

ce code ne me renvoie pas le src en paramètre même avec

Code :

this.getElementsByTagName('img')[0].src

Il me remet juste sur la page sur laquelle je suis déjà.

[andry.aime]

Salut,

Dans l'appel de la fonction Suppr_image tu a une paramètre this or que dans la déclaration de la fonction, tu n'as pas.

Code :

1
2
3
4
function Suppr_image (obj) {
	document.getElementById("suppr-image").href = "suppr_image.php";
	document.getElementById("suppr-image").search = "?IDimage="+obj.getElementsByTagName('img')[0].src;
}

A+.

[lefebvresdesigns]

Envoyé par andry.aime

Salut,

Dans l'appel de la fonction Suppr_image tu a une paramètre this or que dans la déclaration de la fonction, tu n'as pas.

Code :

A+.

Je vous remercie votre aide m'a été tellement utile, sincèrement je remercie la communautée d'aider les débutants comme moi voilà le nouveau code qui marche à merveille :

Code :

1
2
3
4
5
6
7
8
9
 
<script type="text/javascript">
function Suppr_image (obj) {
	document.getElementById("suppr-image").href = "suppr_image.php";
	var Source = obj.getElementsByTagName('img')[0].src;
	var FileName = Source.substring(Source.lastIndexOf("/")+1,Source.length);
	document.getElementById("suppr-image").search = "?IDimage="+FileName;
}
</script>

[SpaceFrog]

Code :

1
2
3
4
function Suppr_image (obj) {
	document.getElementById("suppr-image").href = "suppr_image.php";
	document.getElementById("suppr-image").search = "?IDimage="+obj.getElementsByTagName('img')[0].src.match(/[^\/]+$/);
}