CodeS-SourceS est hébergé par Frontier.fr

Cliquez ici pour mettre ce site au démarrage de votre navigateur

AccueilCodesTutorielsForumsEmploiLivresConnexion

begin process at 2008 11 20 14:06:32

[OPEN XML] LES SPéCIFICATIONS D'OPEN XML ISO ENFIN PUBLIéES ! par neodante

SAF 2008 : DAY I par MPOWARE

PASS 2008 : RéSUMé DE LA PREMIèRE JOURNéE par christian

WINDOWS AZURE SERVICES : PREMIèRE APPLICATION - SERVICE ON THE CLOUD : JUST DO IT ! par redo

SQL SERVER KILIMANJARO : DATA-TIER APPLICATION COMPONENT - DAC par christian

RE : VERIFICATION DE LA LONGEUR D UNE CHAINE EN JAVASCRIPT par Bul3

RE : SELECTION DANS UN TABLEAU par Bul3

RE : SELECTION DANS UN TABLEAU par saltwater08

RE : SELECTION DANS UN TABLEAU par Bul3

RE : INCOMPATIBILITé IE6/IE7 CLIC DROIT AFFICHAGE MENU PERSONNALISé par Bul3

+ de logiciels à télécharger

1 291 789 membres
281 nouveaux aujourd'hui
14 519 membres club

Trouver une ressource

Trouvez une ressource parmi 39 004 codes, 1 202 936 messages d'aide etc...

Recherche: dans [ Dernières recherches ]

Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

SAISIE ET AFFICHAGE D'UNE COULEUR

Information sur la source

Catégorie :Formulaire Niveau : Débutant Date de création : 06/04/2005 Date de mise à jour : 06/04/2005 13:19:51 Vu : 2 639

Auteur : Endymion222

Ecrire un message privé

Note :
Aucune note

Commentaire sur cette source (8)

Ajouter un commentaire et/ou une note

Description

Dans le cadre d'un formulaire HTML, vous devez demander à l'utilisateur de saisir une couleur en hexa (ex: FF00FF).
Afin de lui faciliter la tache, on va lui afficher en temps reel le résultat de sa saisie

Source

<html>
<head>
<title> Saisie de couleur</title>
</head>
<body>
<script language="Javascript">
// mise en place de la couleur
function setColor () {
var reg = /[0-9a-fA-F]{6}/
// verification: couleur valide?
if (reg.test(document.form.color.value))
document.getElementById('couleur').style.backgroundColor = document.form.color.value ;
// sinon fond blanc
else
document.getElementById('couleur').style.backgroundColor = 'FBFBFB' ;
}
// initialisation
setColor() ;
</script>
<form name="form">
<p id="couleur">
Couleur
<input onkeyup="setColor()" maxlength="6" type="text" name="color" size="5" value="EDAAAA"/>
</p>
</form>
</body>
</html>

<html>
 <head>
  <title> Saisie de couleur</title>
 </head>
 <body>
 
 
 	<script language="Javascript">
 	
 		// mise en place de la couleur
		function setColor ()  {			
		    var reg = /[0-9a-fA-F]{6}/
		    
		    // verification: couleur valide? 
			if (reg.test(document.form.color.value))
	  			document.getElementById('couleur').style.backgroundColor = document.form.color.value ;
	  			
	  		// sinon fond blanc
	  		else
	  			document.getElementById('couleur').style.backgroundColor = 'FBFBFB' ;
		} 
		
		// initialisation
		setColor() ;
  	</script>	
 
  	<form name="form">  
 		<p id="couleur"> 
 			Couleur 
 			<input onkeyup="setColor()" maxlength="6" type="text" name="color" size="5" value="EDAAAA"/>  
 		</p>
 	</form>
 
 </body>
</html>

Conclusion

Voila...

C'est mon premier code, alors soyez indulgent ;-).
Testé uniquement sous IE, y a même beaucoup de chance que ca marche pas ailleurs à cause du style...

Historique

06 avril 2005 13:19:51 :

Sources du même auteur

DÉSELECTION D'UN BOUTON RADIO

Toutes les sources de Endymion222

Sources de la même categorie

OBLIGER UN UTILISATEUR DE COCHER UNE CHECKBOX POUR VALIDER U... par yoyo17560

UPLOAD PLUSIEURS FICHIERS FANCYUPLOAD V2 par mnouzahir

ESTIMATION DU DEGRÉ DE CONFIANCE À ACCORDER À UN MOT DE PASS... par vilfarfadet

SLIDER (CURSEUR VARIABLE) ÉLÉMENT JAVASCRIPT par kgilbert

TEST, QUIZZ, QCM, QUESTIONNAIRE SUR RÉPONSE OUI OU NON AVEC ... par BDFC

Toutes les sources de la catégorie Formulaire

Commentaires et avis

Commentaire de coucou747 le 06/04/2005 14:02:29

je n'ai pas pris le temps de lire tout ton code, mais ta reg_exp devrait plutot être ainsi :
/[0-9A-F]{6}/i

Commentaire de Endymion222 le 06/04/2005 15:53:51

Je l'avais ecrite comme ca, mais je me suis aperçu que les minuscules marchaient aussi...

Commentaire de Arto_8000 le 06/04/2005 22:23:18

Ton code est bien mais pour le rendre plus intéressant et plus accessible ( pour ceux qui ne connaisse pas le système hexadécimale ) tu aurais du inclure une fonction qui permet de passer d'un nombre en base 10 à un nombre en base hexadécimale (pour les couleurs). C'est pas si difficile voici comment :

function numberToHexa(num)
{
if (num > 255) return false
result = num%16
base = num/16
base = Math.ceil(base-result/16)
result = Hexa(result)
base = Hexa(base)
return base+""+result
}
function Hexa(number)
{
switch(number)
{
case 11: number = "A"
case 12: number = "B"
case 13: number = "C"
case 14: number = "D"
case 15: number = "E"
case 16: number = "F"
}
return number
}

Et pour le reste il suffit de coller se qu'il retourne en tenant compte que la première couleur est la couleur rouge, la deuxième verte et la troisième bleu . Ex : 323232 donnera une couleur ayant 50 de rouge, 50 de vert et 50 de bleu.

Commentaire de coucou747 le 07/04/2005 20:48:23

je ne vois toujours pas en quoi ma solition serait moins bonne...

Commentaire de Endymion222 le 08/04/2005 15:46:22

Pour répondre à coucou :
Ca se vaut, mais je suis parti du principe que si ca marchait avec des minuscules, pour contraindre l'utilisateur à saisir uniquement en majuscule??

Pour répondre à Arto :
Je veux bien, mais ta fonction marche avec un seul nombre.

Si tu n'en mets qu'une tu ne pourra pas distinguer
12 255 12
et
122 55 12
par exemple.

Tu vas ainsi être obligé de présenter 3 zones de saisie différentes.

Commentaire de coucou747 le 08/04/2005 22:33:21

/i sert à utiliser majuscules et minuscules... Mon expression régulière est équivalente, mais plus interessante car plus courte et donc, plus compréhensible (bien que la tienne ne soit pas compliquée...)

Commentaire de Arto_8000 le 08/04/2005 22:35:20

Ma fonction convertie un seul nombre ,mais tu n'as qu'à n'en faire une autre qui va l'utiliser trois fois, c'est pas sorcier de le faire à partir d'un seul input. Tu n'as qu'à faire un split.

Commentaire de Endymion222 le 13/04/2005 15:41:39

Mais alors tu fais comment pour distinguer les combinaisons de chiffres...

Je me repete:
12 255 12
et
122 55 12

S'ecrivent tous les 2: 1225512, du moins si tu mets un champs unique...

Merci Coucou.. J'avais raté ton /i ;-)