Valider un numéro de carte bancaire

Script complet (CSS, JS, SVG) de validation à la volée de formats de cartes de crédit.
Le but n'est pas de faire un cours sur l'algorithme de Luhn et sur les patterns, le script valide le numéro selon le type de carte (Visa, Carte bancaire, Mastercard, Maestro, American Express, Discover, JCB Card, Diners Club).

Code HTML

Exemples de validations

Saisir un numéro de carte dans un champ ou cliquer sur un numéro proposé. Pour chaque carte, le 2ème numéro est invalide.

Numéros « Visa » :
4373 0977 3270 0163
4291 1868 2920 9889
Numéros « Carte bancaire » :
4737 2893 2381 1274
4737 2893 5381 1374
Numéros « Mastercard » :
5374 0521 0623 4089
5374 0521 0622 4089
Numéros « Maestro » :
5282 4065 4325 9318
5282 4065 4325 0318
Numéros « American Express » :
3735 5071 1452 204
3735 5071 1451 204
Numéros « Discover » :
6011 2058 2673 3031
6011 2058 2673 3030
Numéros « JCB Card » :
3549 2173 2553 3422
3549 2173 2553 3423
Numéros « Diners Club » :
3004 2745 8721 31
3004 2745 8721 41

Les sources complètes

La fonction est en deux partie, plus une feuille de style et un SVG :

  • creditCardNumberFormatControl qui vérifie la validité du numéro ; Ouvrir dans une nouvelle fenêtre
  • Une fonction « locale » qui utilise creditCardNumberFormatControl à adapter selon vos besoins.
  • La feuille de styles Ouvrir dans une nouvelle fenêtre
  • Le fichier SVG contenant tous les logos Ouvrir dans une nouvelle fenêtre

Source des numéros : https://ccardgenerator.com/fr/

Utilisation des sources
Les sources de « Valider un numéro de carte bancaire » proposées par sont mises à disposition selon les termes de la licence Creative Commons CC BY-NC-SA 4.0 (licence Creative Commons CC BY-NC-SA 4.0 : Attribution - Pas d'utilsation commerciale - Partage dans les mêmes conditions).
Si vous souhaitez participer, même modestement, au maintien du site et pour son usage, vous pouvez cliquer sur le joli bouton…
Un petit sou avec
2021-01-28