Bonjour,
J'aimerai mettre en couleur le texte à côté d'un bouton radio lorsque je clique sur ce bouton. Mais projet est un quizz. Il y a des plusieurs questions avec plusieurs boutons radio.
Voici la ou je suis arrivé :
J'arrive à coché par défaut le bouton radio 1 de chaque question.
J'arrive à colorer le texte lorsque je clique sur un bouton radio mais le soucis c'est que les autres bouton qui sont également coché (normal ils sont coché par défaut) deviennent rouge.
Je dois obligatoirement avoir un bouton coché par défaut, c'est dans mon cahier des charges. Si quelqu'un peut m'aider car je n'y arrives pas. Je suis dessus depuis hier
Voici le code :
[code]
<html>
<head>
<title>Quiz Info De Base</title>
<style>
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #ffffff;
background-attachment : fixed;
font-size: 11px;
}
.orange {
color: #FF0000;
font-weight: bold;
.noir {
color: #000000;
font-weight: bold;
}
</style>
</head>
<body background=image/imagefond.jpg>
<?php
$quizz= array(
array("<u>Question 1</u> : Quel dossier est spécialement prévu pour vous permettre de stocker vos données personnelles ?","Ordinateur","Documents","Corbeille","2","<b><u>Commentaire</u></b> : Pour rappel, Documents est votre dossier personnel, dans lequel vous rangerez toutes vos données."),
array("<u>Question 2</u> : Quelle est la version la plus récente de Windows ?","XP","Millenium","Seven (7)","98","Vista","3","<b><u>Commentaire</u></b> : Nous avons dans l'ordre : 98 ; Millenium ; X¨; Vista ; Seven (7)."),
array("<u>Question 3</u> : Parmi ces unités de mesure, quelle valeur est la plus importante ?","Mega-Octet","Kilo-Octet","Giga-Octet","3","<b><u>Commentaire</u></b> : Nous avons dans l'ordre : Kilo-Octet ; Mega-Octet ; Giga-Octet."),
array("<u>Question 4</u> : Parmi ces supports de stockage, lequel a disparu ?","La clef USB","La disquette","Le CD-ROM","2","<b><u>Commentaire</u></b> : La disquette a disparu car sa technologie est dépassé."),
array("<u>Question 5</u> : Que trouve t-on dans la colonne de gauche du menu DEMARRER","La météo","Vos documents","Vos programmes","3","<b><u>Commentaire</u></b> : La colonne de gauche contient tous les programmes que vous possédez dans votre ordinateur."),
array("<u>Question 6</u> : Que signifie les lettres PC ?","Personnal Computer","Private Computer","Plante Constamment","Petit Castor","1","<b><u>Commentaire</u></b> : Ce sigle est tiré de l'anglais Personnal Computer signifiant en français ordinateur personnel."),
array("<u>Question 7</u> : Combien y a t-il de boutons au minimum sur une souris ?","1","2","3","4","2","<b><u>Commentaire</u></b> : Il y a au moins le bouton gauche et le bouton droit mais certaines souries sont pourvues de boutons supplémentaires"),
array("<u>Question 8</u> : Avec l'écran et le clavier, quel est le dernier élément indispensable pour utiliser un ordinateur ?","La manette","La souris","L'imprimante","La webcam","2","<b><u>Commentaire</u></b> : La souris est un élément vitale de l'ordinateur car la quasi-totalité de ce qu'on peut faire se fait via la souris."),
array("<u>Question 9</u> : Quel élément ne retrouve t-on pas dans le menu DEMARRER ?","Documents","Ordinateur","Images","Corbeille","4","<b><u>Commentaire</u></b> : La corbeille est la seule icône qui ne se trouve que sur le Bureau de Windows"),
array("<u>Question 10</u> : A quoi ressemble un icône ?","A une flèche","A une petite image avec du texte","A un texte simple","A rien, ça n'existe pas","2","<b><u>Commentaire</u></b> : On retrouve toujours des icônes sur le Bureau de Windows par exemple, ou dans une clef usb... On doit toujours double-cliquer gauche sur une icône."),
);
include("infodebasecorrection.php");
?>
</body>
</html>
[/code]
[code]<html>
<head>
<script>
function basculeOrange(elem) {
var liste = document.getElementsByTagName('input');
for (var i = 0; i < liste.length; i++) {
if (liste[i].type==="radio"){
if(liste[i].checked){
liste[i].nextSibling.className="orange";
}else{
liste[i].nextSibling.className="";
}
}
}
}
</script>
</head>
<body>
<?php
error_reporting(E_ALL ^ E_NOTICE); // pour éviter certaines erreurs à l'affichage
if (!isset($_POST['result'])) {
print "<input onclick='history.go(-1)' type='image' name='image' value='Retour' src='image/boutonretour.gif'/>"; // Bouton Retour
print '<center><FONT face="French Script MT" size="50" >Initiation : Info De Base</FONT></center><br>'; // Titre du haut de la page
print '<center><FONT face="French Script MT" size="5" ><b>Avant de commencer le Quiz, merci de remplir les champs Nom et Prénom</b></FONT></center><br>'; // Titre du haut de la page
print '<center><FONT face="French Script MT" size="5" ><b>Vérifiez bien que vous avez répondu à toutes les questions puis valider</b></FONT></center><br>'; // Consignes du quiz
print '<center><FONT face="French Script MT" size="5" ><b>Attention : Toutes les questions ont une réponse cochée par défaut.</b></FONT></center><br>';
print '<center><FONT face="French Script MT" size="5" ><b>Ce nest pas obligatoirement la bonne réponse.</b></FONT></center><br>';
print '<center><FONT face="French Script MT" size="5" ><b>1 seule réponse par question est possible.</b></FONT></center><br>';
print '<center><FONT face="French Script MT" size="5" ><b>Bonne Chance.</b></FONT></center><br>';
print "<form id=\"form1\" action=\"{$_SERVER['PHP_SELF']}\" method='post'>";
print '<b> Votre Nom :</b> <input type=text name="nom">'; // Champ Nom
print '<b> Votre Prénom :</b> <input type=text name="prenom"><br><br>'; // Champ Prénom
for ($i=0; $i<count($quizz); $i++) {
print '<blockquote><span class="noir">';
print $quizz[$i][0];
print '</span><br /><br />';
for ($j=1; $j<count($quizz[$i])-2; $j++) {
$question=$quizz[$i][$j];
if($j == 1) {
print "<input type='radio' name=\"$i\" checked=\"$checked\" onclick='basculeOrange(this)' value=\"$j\" /><span> $question</span><br /> "; // Bouton radio, premier coché par défaut
}else {
print "<input type='radio' name=\"$i\" onclick='basculeOrange(this)' value=\"$j\" /><span> $question</span><br /> "; // Lors d'un clic sur un bouton radio, la proposition qui correspond à ce bouton devient orange
}
}
print "</blockquote>";
}
$nombrepoints=0;
print "<input type='hidden' name='result' value='voir' /><br />\n<center>";
print "<input type='image' src=image/boutonvalider.gif value='VALIDER' />"; // Bouton Valider
}else {
$nom = $_POST['nom']; // On récupère le nom de la personne
$prenom = $_POST['prenom']; // On récupère le prénom de la personne
if(($nom!="") && ($prenom!="")) {
print '<center><FONT face="French Script MT" size="50" >Initiation Info De Base : Correction</FONT></center><br>'; // Titre de haut de la page Correction
$points=0;
for($i=0; $i<count($quizz); $i++ ) {
$mareponse = trim($_POST[$i]);
print '<blockquote><span class="orange">';
print $quizz[$i][0]."</span><br /><br />";
$numero_bonne=$quizz[$i][count($quizz[$i])-2]; // avant dernière valeur du tableau
$bonnereponse=$quizz[$i][$numero_bonne]; // Bonne réponse
if ($mareponse==$numero_bonne) { // Si la réponse est celle attendu
print "<b><u>Réponse</u></b> : Vous avez répondu <b><i>".$bonnereponse."</i></b> et vous avez raison."; // Message si la réponse est correct
$nombrepoints++;
}else { // Sinon, si la réponse n'est pas celle attendu
print "<b><u>Réponse</u></b> : Vous avez répondu <b>".$quizz[$i][$mareponse]."</b> mais la bonne réponse est <b>".$bonnereponse."</b> " ; // Message si la réponse est incorrect
}
$commentaire=$quizz[$i][count($quizz[$i])-1]; // dernière valeur du tableau
print "<br />".$commentaire."<br />"; // Commentaires lors de la correction du quiz
print "</blockquote>";
}
if($nombrepoints==count($quizz)) { // Si j'ai bon à toutes les questions
print"<h1 align='center'>Félicitations Toutes vos réponses sont correctes!</h1>"; // Message si vous avez répondu correctement à toute les questions
}else {
if ($nombrepoints=="") { // Nombre de points = 0 si toutes les réponses sont fausses
$nombrepoints = 0 ;
}
print "<br /><h1 align='center'>Vous avez la note de $nombrepoints sur ".count($quizz); // Message si il y a minimum 1 erreur
}
// envoi du mail
$headers ='From: "cyber quizz"<
[email protected]>'."\n";
$headers .='Reply-To:
[email protected]'."\n";
$headers .='Content-Type: text/plain; charset="iso-8859-1"'."\n";
$headers .='Content-Transfer-Encoding: 8bit';
$mail = mail('
[email protected]', 'note du quizz [Info De Base]', "$nom $prenom a obtenu la note de $nombrepoints sur 10", $headers); // contenu du mail
}else{ // Message d'alert et redirection vers la page ou il y a les questions.
if(($nom=='')&&($prenom=='')) {
echo"<script LANGUAGE='JavaScript'>alert('Veuillez remplir les champs Nom et Prenom ');</SCRIPT>";
echo"<script LANGUAGE='JavaScript'>window.location='http://127.0.0.1/Utilisateur_Quiz_Des_Initiations/Utilisateur_Quiz_Des_Initiations/infodebase.php';</SCRIPT>";
}
if($nom == '') { // Message d'alert et redirection vers la page ou il y a les questions.
echo"<script LANGUAGE='JavaScript'>alert('Veuillez remplir le champ Nom');</SCRIPT>";
echo"<script LANGUAGE='JavaScript'>window.location='http://127.0.0.1/Utilisateur_Quiz_Des_Initiations/Utilisateur_Quiz_Des_Initiations/infodebase.php';</SCRIPT>";
}
if($prenom == '') { // Message d'alert et redirection vers la page ou il y a les questions.
echo"<script LANGUAGE='JavaScript'>alert('Veuillez remplir le champ Prenom');</SCRIPT>";
echo"<script LANGUAGE='JavaScript'>window.location='http://127.0.0.1/Utilisateur_Quiz_Des_Initiations/Utilisateur_Quiz_Des_Initiations/infodebase.php';</SCRIPT>";
}
}
}
?>
</body>
</html>
[/code]
Le soucis doit venir de mon script :
[code]
<script>
function basculeOrange(elem) {
var liste = document.getElementsByTagName('input');
for (var i = 0; i < liste.length; i++) {
if (liste[i].type==="radio"){
if(liste[i].checked){
liste[i].nextSibling.className="orange";
}else{
liste[i].nextSibling.className="";
}
}
}
}
</script>
[/code]
