begin process at 2012 05 29 00:58:41
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Archive Javascript

 > 

Archives

 > 

AU SECOURS !!!

 > 

Bouton radio en sélectionnant change des images


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Bouton radio en sélectionnant change des images

lundi 6 février 2006 à 17:28:30 | Bouton radio en sélectionnant change des images

jfkill


Je suis assez débutant dans le codage javascript.
J'ai un formulaire avec des données qui change selon qu'elles sont métriques ou impérial En sélectionnant avec deux boutons radio. Mon code fonctionne très bien. Sauf que je veux ajouter une fonction qui fait que j'ai 3 images qui changent en meme temps que les données. Par exemple je choisi le bouton impérial, j'affiche les images qui sont associé au bouton impérial

Comment dois-je m'y prendre de façon simple sans défaire ce que j'ai déjà fait

J'ai essayé d'ajouter   element[image] mais le problème c'est que les images ne reviennent pas si je reviens sur le premier bouton radio sélectionné.

Voici mon code:

<script language="JavaScript">
<!--
function WEchangeUnitOfMeasure() {

document.tableausalle.Super200.value = '1';
document.tableausalle.Dim200.value = '2';
document.tableausalle.Haut200.value = '3';
document.tableausalle.elements["image1"].src="dimensions.gif";
document.tableausalle.elements["image2"].src="superficie.gif";
document.tableausalle.elements["image3"].src="hauteur.gif";
}

function WeToggleUnitOfMeasure() {
if (document.tableausalle.UnitOfMesure(0).checked)
{
WEchangeUnitOfMeasure();
document.tableausalle.UnitOfMesure(0).checked = false;
document.tableausalle.UnitOfMesure(1).checked = true;
} else {
document.tableausalle.reset();
}
}
-->
</script>
<BR>
        <form name="tableausalle">
        <a href="javascript:void(null);" onClick="javascript:WeToggleUnitOfMeasure();" >Unité
de mesure</a><input type="radio" name="UnitOfMesure" value="Metric" checked onClick="Javascript:document.tableausalle.reset();">
<span class="text-bl-small">metre</span>
<input type="radio" name="UnitOfMesure" value="Imperial" onClick="Javascript:WEchangeUnitOfMeasure();">
<span class="text-bl-small">pieds</span><br><br><br>
        
        <input type="text" size="17" name="Dim200" value="8" READONLY>
<input type="text" size="7" name="Super200" value="9" READONLY>
             <input type="text" size="7" name="Haut200" value="10" READONLY>
<IMG SRC="../../img/centre/salles/tableau/dimensions_new.gif" WIDTH="96" HEIGHT="72" name="image1">
<IMG SRC="../../img/centre/salles/tableau/superficie_new.gif" WIDTH="42" HEIGHT="72" name="image2">
<IMG SRC="../../img/centre/salles/tableau/hauteur_new.gif" WIDTH="45" HEIGHT="72" name="image3">
</form>


Merci
mardi 7 février 2006 à 08:37:55 | Re : Bouton radio en sélectionnant change des images

bultez

Membre Club
Réponse acceptée !

Bonjour,
si j'ai compris ce qu'il fallait faire ?


<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
<script type="Text/JavaScript"><!--
function WeToggleUnitOfMeasure()
{
 if ( document.tableausalle.UnitOfMesure(1).checked )
   {
    document.tableausalle.Super200.value = '1';
    document.tableausalle.Dim200.value = '2';
    document.tableausalle.Haut200.value = '3';
    document.tableausalle.image1.src="../../img/centre/salles/tableau/dimensions.gif";
    document.tableausalle.image2.src="../../img/centre/salles/tableau/superficie.gif";
    document.tableausalle.image3.src="../../img/centre/salles/tableau/hauteur.gif";
   }
 else {
    document.tableausalle.Super200.value = '8';
    document.tableausalle.Dim200.value = '9';
    document.tableausalle.Haut200.value = '10';
    document.tableausalle.image1.src="../../img/centre/salles/tableau/dimensions_new.gif";
    document.tableausalle.image2.src="../../img/centre/salles/tableau/superficie_new.gif";
    document.tableausalle.image3.src="../../img/centre/salles/tableau/hauteur_new.gif";    
   }
}
//--></script>
<BR />
<form name="tableausalle">
Unité de mesure
<input type="radio" name="UnitOfMesure"
  value="Metric" checked
  onClick="WeToggleUnitOfMeasure();">
<span class="text-bl-small">metre</span>
<input type="radio" name="UnitOfMesure" value="Imperial"
  onClick="WeToggleUnitOfMeasure()">
<span class="text-bl-small">pieds</span><br /><br /><br />
<input type="text" size="17" 
  name="Dim200" value="8" READONLY>
<input type="text" size="7" 
  name="Super200" value="9" READONLY>
<input type="text" size="7" 
  name="Haut200" value="10" READONLY>
<IMG SRC="../../img/centre/salles/tableau/dimensions_new.gif"
  WIDTH="96" HEIGHT="72" name="image1">
<IMG SRC="../../img/centre/salles/tableau/superficie_new.gif"
  WIDTH="42" HEIGHT="72" name="image2">
<IMG SRC="../../img/centre/salles/tableau/hauteur_new.gif"
  WIDTH="45" HEIGHT="72" name="image3">
</form>
</BODY>
</HTML>



Cordialement. Bul. ~
Site ~

mardi 7 février 2006 à 21:51:49 | Re : Bouton radio en sélectionnant change des images

jfkill

Merci beaucoup pour le code ça fonctionne bien sur Explorer

Mais sur FIREFOX patate, aucun changement ne s'effectue lorsque je change de bouton.

Solution???

mercredi 8 février 2006 à 08:47:20 | Re : Bouton radio en sélectionnant change des images

bultez

Membre Club
Réponse acceptée !

c'est vrai qu'il faudrait toujours tester avec FF,
si ça passe avec, ça marchera avec IE...

function WeToggleUnitOfMeasure()
{
 if ( document.tableausalle.UnitOfMesure[1].checked )
   { ...


Cordialement. Bul. ~ Mon Site à Moi ~



Cette discussion est classée dans : bouton, images, document, radio, tableausalle


Répondre à ce message

Sujets en rapport avec ce message

Pb : onClick d'un bouton radio pour disparition d'un <DIV> [ par beku ] BonjourJe voudrais faire disparaitre le suivanten cliquant sur le bouton radio<br Fonction et bouton radio [ par isu_san ] Bonjour je m'expliquej'ai un formulaire avec un choix entre deux options, j'ai donc mis deux cases a cocher avec le meme nom<input type="radio" value= Value bouton radio ! [ par L0rD59580 ] J'ai un soucis pour récupérer la value d'un bouton radio regarde le codepour le bouton radio j'ai la réponse "Undefined" pour le champ de texte je reç activer-désactiver une liste déroulante selon le bouton radio coché [ par jesscolor83 ] Bonjour,en fait je veux que selon le bouton radio coché, je veux faire apparaitre une liste déroulante. Le problème est que dès que je coche le second OnChange sur bouton radio [ par gatsue ] Salut,Voila j'ai ecrit ca comme code pour mon bouton radio et ca marche pas :Je l'ai mis dans le OnChange!!!if (document.radio[i].checked){alert("Ca m MOUSE OVER [ par mimosa803 ] salut à tous, je veux réalisé l'événement Mouse over et Mouse out ,mais ca ne fonctionne pas,donc j'éspere que vous m'aider et merci d'avance.Mouse    Récupération de valeur [ par metalgear ] Bonjour,Voilà j'espère ne pas vous poser une colle  voiçi ma question :J'ai une page (parent) qui ouvre une popup (blank).Dans ma page parent j'ai un besoin d'aide sur un script de selection d'image [ par gohu06 ] Bonjour J'ai réalisé un script pour que lorsque le visiteur séléctionne un nom dans un des 3 menus déroulants, un photo s'affiche dans un emplacement un petit probleme [ par liocsh ] Bonjour, je voudrais de l'aide pour ce petit script :Attribuer une donnée a une variable ici "ww" pour faire afficher des images de nom 1.jpg, 2.jpg.. Problème avec onmouse et images [ par dedeazer ] Bonsoir,Je souhaite afficher un bouton image (bouton.jpg) et qui lors du passage de la souris dessus change d'aspect (bouton_enfonce.jpg) et qu'une au


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,749 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales