Discussion :

[Fingertip]

Bonjour � tous,

J'ai dans le cadre d'un projet r�aliser une petite page web en html/css, seulement je dois ajouter une fonction JavaScript que je ne ma�trise pas.

J'aimerais avoir s'il est possible d'incrementer/decrementer un input au clique d'une image (+/-).

Je n'ai pas le code sur ce pc mais il ressemble a ceci:

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
<input type="text" value="1" name="quantite"/>
<a><img src="images/fleches_haut" name="fleche_haut" alt=""/></a>
<a><img src="images/fleches_bas" name="fleche_haut" alt=""/></a>

[vermine]

Bonjour,

Sur le onclick des images ou des liens, vous pouvez ajouter cette fonction-ci :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
 
function ma_fonction()
{
	++(document.getElementById("mon_id").value);
}

O� "mon_id" est l'id de l'input. Et une version avec "--" pour la d�cr�mentation.

[Fingertip]

Merci de ton aide!

Si je comprend bien voici mon code:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
function qte_plus()
{
	++(document.getElementById("fleche_haut").value;)
}
 
function qte_moins()
{
	++(document.getElementById("fleche_bas").value;)
}

avec dans mes images:

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
<img class="fleche_haut" src="images/fleche_haut.gif" name="plus" width="12" height="9" border="0" alt="" onclick="qte_plus()";/>
et
<a href=""><img class="fleche_bas" src="images/fleche_bas.gif" name="moins" width="12" height="9" border="0" alt="" onclick="qte_moins()";/></a>

Cela ne semble malheureusement pas fonctionner, ou est ce que ca coince ?!

[andry.aime]

Bonsoir,

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

<input type="text" value="1" name="quantite" id="quantite"/>

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

++(document.getElementById("quantite").value;)

A+.

[vermine]

Comme l'a expliqu� andry.aime, c'est l'input qu'il faut r�f�rencer, pas les images.
getElementById va en fait r�cup�rer l'�l�ment avec tel id. De l�, on prend sa valeur (.value) pour la modifier.

Et pour la fonction qte_moins(), ce n'est pas "++" mais "--". De plus, le point-virgule arrive apr�s la parenth�se.

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
function qte_moins()
{
	--(document.getElementById("fleche_bas").value);
}

[Fingertip]

Bonjour,

Voici donc mes modifications apport�es:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script language="Javascript">
 
function qte_plus()
{
	++(document.getElementById("quantite").value);
}
 
function qte_moins()
{
	--(document.getElementById("quantite").value);
}
 
</script>
</head>

et:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
<input type="text" name="quantite" id="quantite" value="1"/>
 
Le onclick dans les images est bon ?
<a href="#"><img class="fleche_haut" src="images/fleche_haut.gif" name="plus" width="12" height="9" border="0" alt="" onclick="qte_plus()";/></a>

Cela ne semble pas encore fonctionner

Merci encore =)