Bonsoir, j'aimerais avoir quelques conseils je suis actuellement en train d'essayer de faire un "projet" mais je suis face à un mur depuis quelques jours.

Alors ce que je voudrais savoir c'est si il est possible de remplacer la source (src) d'une image que je possède dans un dossier 

Exemple: 

J'ai 3 boutons qui permettent de générer des images aléatoirement,

Le 1er bouton génère aléatoirement l'image1 (avec comme source): ../sprites/130.png (sur son image 1)

Le 2ème bouton génère aléatoirement l'image2 (avec comme source): ../sprites/46.png (sur son image 2)

et le 3ème bouton génère aléatoirement l'image3 (avec comme source): ../sprites/fused/130.46.png (sur son image 3)

Et je voudrais savoir si il y à possibilité de cliquer juste sur le 1er bouton pour qu'on change le "130" de l'image 3 mais tout en gardant le 46?

C'est surement pas très clair comme ça, mais si il faut fournir les codes que j'utilise je le ferrais.

Merci à vous, pour l'aide que vous m'apporterez.

Tim.art a écrit:

Tout est possible.

-
Edité par LudoChrn 13 décembre 2019 à 7:24:42

Alors 

Pour le 1er bouton : 

html:

<img name="myImage" id="pic1" width=128 height=128 src="../sprites/1.png"/><br/>
<a id="random" href="#" onclick="randomImg();">Aléatoire</a>

JS:

function randomImg() {
var randomNumber = Math.floor(Math.random() *150) +1;
var imgName = randomNumber+".png";
var imgName2 = randomNumber;
document.getElementById("pic1").src = "../sprites/"+imgName;
document.getElementById("pic3").src = "../sprites/fused/"+imgName2+".";
}

Le bouton 2 :

html:

<img id="pic2" width=128 height=128 src="../sprites/1.png"/><br/>
<a id="random" href="#" onclick="randomImg2();">Aléatoire</a>

JS:

function randomImg2() {
var randomNumber3 = Math.floor(Math.random() *150) +1;
var imgName4 = randomNumber3+".png";
document.getElementById("pic2").src = "../sprites/"+imgName4;
}

Et le bouton 3:

html:

<img id="pic3" width=128 height=128 src="../sprites/1.1.png"/><br/>
<a id="test" href="#" onclick="randomImg3();">Aléatoire</a>

JS: 

function randomImg3() {
var randomNumber = Math.floor(Math.random() *150) +1;
var randomNumber2 = Math.floor(Math.random() *150) +1;
var imgName = randomNumber+".png";
var imgName2 = randomNumber2+".png";
var imgName3 = randomNumber+"."+randomNumber2+".png";
document.getElementById("pic1").src = "../sprites/"+imgName;
document.getElementById("pic2").src = "../sprites/"+imgName2;
document.getElementById("pic3").src = "../sprites/fused/"+imgName3;
}

Voila

-
Edité par LudoChrn 13 décembre 2019 à 10:10:44

J'ai modifié désolé

EDIT: J'ai trouver ça:

var str = document.getElementById("pic2").src;
  var res = str.substr(57);
  document.getElementById("pic3").src = "../sprites/fused/" + imgName2 + res;

Et j'obtiens donc ../sprites/fused/pic1.pic2.png

Mais maintenant le moins compréhensible c'est pour le deuxieme bouton:

var str = document.getElementById("pic1").src;
  var res = str.substr(57);
  document.getElementById("pic3").src = "../sprites/fused/" + res + imgName2;

le résultats final c'est ../sprites/fused/pic1.png.pic2.png

-
Edité par LudoChrn 13 décembre 2019 à 11:11:02

Bonjour LudoChrn,

Des exemples :

https://codepen.io/Zonecss/pen/YzPGQQo