Convertisseur décimal <-> hexadécimal

**Bovino** · 01/11/2008, 14h46

Bonjour,

Voilà une petite contribution (pas grand chose à vrai dire !) sur un sujet auquel j'ai été confronté récemment.
Ce script prend une valeur en entré et converti soit du décimal en hexa, soit de l'hexa en décimal.

C'est pratique pour certaines gestions des couleurs !

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 	<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Conversion Décimal / Hexa</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Author" content="Bovino - www.developpez.com" />
<script type="text/javascript">
<!--
function toHexa(){
    var regDec = /^\d+$/;
    var initial = document.getElementById('valeur').value;
    if(regDec.test(initial)){
        var converti = parseInt(initial,10).toString(16).toUpperCase();
        document.getElementById('resultat').innerHTML = 'Décimal : '+initial+' =&gt; Hexadécimal : '+converti;
    }
    else{
        alert('La valeur entrée n\'est pas décimale !');
    }
}
function toDec(){
    var regHexa = /^[a-f\d]+$/i;
    var initial = document.getElementById('valeur').value.toUpperCase();
    if(regHexa.test(initial)){
        var converti = parseInt(initial,16);
        document.getElementById('resultat').innerHTML = 'Hexadécimal : '+initial+' =&gt; Décimal : '+converti;
    }
    else{
        alert('La valeur entrée n\'est pas hexadécimale !');
    }
}
//-->
</script>
</head>
 
<body>
<div style="margin: 50px 0 0 50px">
    <label for="valeur">Entrez la valeur à convertir : </label>
    <input type="text" id="valeur" onfocus="this.value=''" /><br />
    <input type="button" onclick="toHexa()" value="Convertir en hexadécimal" />
    <input type="button" onclick="toDec()" value="Convertir en décimal" />
</div>
<div id="resultat" style="text-align:center;margin-top:20px;"></div>
</body>
</html>

Euh... pas besoin de commentaire là-dessus, je sais que c'est très laid !!!

**Auteur** · 01/11/2008, 18h13

là j'avoue

Je ne connaissais pas

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

parseInt(initial,10).toString(16)

pour passer de la base 10 à la base 16

Invité · 09/11/2008, 12h36

Bonjour Bovino,

Excellent cette convertion !
Sinon:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var regHexa = /^[a-f\d]+$/i;

devrait être:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var regHexa = /^[A-F\d]+$/i;

Une solution plus générale:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function toHex(IdIn, IdOut) {
  var nbArg = toHex.arguments.length;
  var oDec = document.getElementById(IdIn);
  var oHex = document.getElementById(IdOut);
  var regDec = /^\d+$/;
  // Vérif condition mini ok
  if (nbArg <1 || oDec == null || !regDec.test(oDec.value)) return false;
  var result = parseInt(oDec.value,10).toString(16).toUpperCase();
  if (nbArg == 2 && oHex != null) oHex.value = result;
  return  result;
}
 
function toDec(IdIn, IdOut) {
  var nbArg = toDec.arguments.length;
  var oDec = document.getElementById(IdOut);
  var oHex = document.getElementById(IdIn);
  var regDec = /^[a-fA-F\d]+$/;
  // Vérif condition mini ok
  if (nbArg <1 || oHex == null || !regDec.test(oHex.value)) return false;
  var result = parseInt(oHex.value,16);
  if (nbArg == 2 && oDec != null) oDec.value = result;
  return  result;
}

A+

**Auteur** · 09/11/2008, 13h18

Envoyé par jlmag

Sinon:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var regHexa = /^[a-f\d]+$/i;

devrait être:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var regHexa = /^[A-F\d]+$/i;

il y a le commutateur "i" (ignore case) donc les deux expressions régulières sont équivalentes

Invité · 09/11/2008, 14h25

Oups, ma vue faiblie, ou serait-ce mon attention.
Effectivement !

Non obstant, alors pourquoi faire:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var initial = document.getElementById('valeur').value.toUpperCase();

**Auteur** · 09/11/2008, 18h29

Envoyé par jlmag

Non obstant, alors pourquoi faire:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var initial = document.getElementById('valeur').value.toUpperCase();

sans doute parce que le parseInt() qui suit cette instruction ne prend que des majuscules pour une conversion de la base 16 vers la base 10.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var converti = parseInt(initial,16);

[edit]
Après vérification, parseInt() accepte bien les minuscules.
C'est sans doute pour uniformiser l'écriture qu'il passe en majuscules

(pour ma part, j'écris toujours mes nombres hexadécimaux en majuscules)
[/edit]

Invité · 09/11/2008, 22h55

Envoyé par Auteur

[edit]
Après vérification, parseInt() accepte bien les minuscules.
C'est sans doute pour uniformiser l'écriture qu'il passe en majuscules

(pour ma part, j'écris toujours mes nombres hexadécimaux en majuscules)
[/edit]

Bovino devrait donc tester suivant l'expression:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var regHexa = /^[A-F\d]+$/;

Cela pourrait éviter des erreurs de lecture (de code). J'en suis le plus criant exemple

(Me too pour l'écriture hexa)
A+

**Bovino** · 10/11/2008, 08h09

Envoyé par Auteur

Après vérification, parseInt() accepte bien les minuscules.
C'est sans doute pour uniformiser l'écriture qu'il passe en majuscules

(pour ma part, j'écris toujours mes nombres hexadécimaux en majuscules)

Oui, c'est exactement pour ça !

Pour ce qui est de l'expression régulière, les deux sont effectivement équivalentes...

Convertisseur décimal <-> hexadécimal

Contribuez

Discussions similaires

Partager

Partager