Validar números de tarjetas de crédito con JavaScript

07/mar/2008 JavaScript 6 Comentarios
javascript

Hace ya bastante tiempo leí en anieto2K un pequeño, pero a la vez interesante artículo sobre como validar números de tarjetas de crédito con JavaScript mediante unas sencillas expresiones regulares en Javascript. La idea es validar una tarjeta de crédito Visa y una tarjeta de crédito MasterCard. En nuestro caso vamos a ver el código completo del ejemplo.

Lo primero que tenemos que saber es el formato de los números de estas tarjetas de crédito, para poder montar las expresiones regulares que lo validen.

  • Visa, son 4 grupos de 4 dígitos cada uno. Además el primer número de la tarjeta tiene que empezar por 4. Un total de 16 dígitos. Un ejemplo de número de una tarjeta Visa sería el siguiente: 4552 7204 1234 5678.
  • Mastercard, de igual manera son 4 grupos de 4 dígitos cada uno. Pero en este caso los dos primeros dígitos van del 51 al 55. Un total de 16 dígitos. Un ejemplo sería 5588 3201 2345 6789.

Ahora construyamos las expresiones regulares. Lo primero que tenemos que saber es que una expresión regular comienza con /^ y termina con $/. Entre estos caracteres estará la expresión regular.

  1. /^ expresion regular $/

Como vamos a manejar dígitos tenemos que saber que el dígito lo representa el carácter d. Así:

  1. /^dd$/

sería una expresión regular que validase dos dígitos seguidos. Pero como no es plan de poner una ristra de caracteres d hasta llegar a 16 podemos utilizar la cardinalidad, es decir, el número de veces que se repite un dígito. Para ello utilizamos la siguiente expresión :

  1. {cardinalidad}

Así los dos dígitos quedarían de la siguiente forma:

  1. /^d{2}$/

Alguna cosa más que tenemos que saber es que si queremos que en una posición vaya un número específico valdría con poner el número y de igual forma podemos expresar rangos mediante corchetes y el rango en concreto.

  1. [rango]

Así, si queremos hacer referencia a los números entre el 500 y el 509 podríamos tener la siguiente expresión regular:

  1. /^50[1-9]$/

Por último, si queremos hacer referencia a que un número o carácter aparezca o no, es decir, la opcionalidad. Utilizamos el símbolo de cierre de interrogación (?). Esto nos servirá para hacer referencia que entre los grupos de dígitos de 4 de las tarjetas pueda venir un guión o no.

Finalmente las expresiones regulares de Visa y Mastercard serian las siguientes

  1. /^4\d{3}-?\d{4}-?\d{4}-?\d{4}$/ //Visa
  2. /^5[1-5]\d{2}-?\d{4}-?\d{4}-?\d{4}$/ //Mastercard

Para validar si una cadena se ajusta a una expresión regular tenemos varios métodos. En nuestro caso utilizamos match. Este método le aplicamos directamente sobre la cadena

  1. umer.match(/^5[1-5]\d{2}-?\d{4}-?\d{4}-?\d{4}$/)

Esto nos devolverá un valor booleano. Es por ello que simplemente tendremos que comprobar el valor retornado:

  1. if (!visa.match(/^4\d{3}-?\d{4}-?\d{4}-?\d{4}$/))
  2. visa_error = "No es un número de Visa correcto";
  3.  
  4.  
  5. if (!mastercard.match(/^5[1-5]\d{2}-?\d{4}-?\d{4}-?\d{4}$/))
  6. mastercard_error = "No es un número de Visa correcto";

Vía: anieto2K

Vídeos sobre JavaScript

Difunde el Conocimiento

Si te ha gustado el artículo o te ha sido de utilidad, no dejes de compartirlo con tus amigos en las redes sociales... Te estaremos muy agradecidos. :-D

6 comentarios en “Validar números de tarjetas de crédito con JavaScript”

Víctor Cuervo

lara

gracias por todo lo que estan haciendo
los felicito a todos

Víctor Cuervo

oscar

SOLUCIONADO IE

Validar numero de tarjeta

function validarTarjetas(){

visa = document.getElementById(“visa”).value;
mastercard = document.getElementById(“mastercard”).value;

if ((document.Form1.visa.value == “”) || (document.Form1.visa.value== null)) {
document.getElementById(“visa_error”).innerHTML = “”;
document.getElementById(“visa_paso”).innerHTML = “”;
}else{
if (!visa.match(/^4\d{3}?\d{4}?\d{4}?\d{4}$/)){
document.getElementById(“visa_error”).innerHTML = “No es un número de Visa correcto”;
document.getElementById(“visa_paso”).innerHTML = “”;}
else{
document.getElementById(“visa_paso”).innerHTML = “Número de Visa correcto”;
document.getElementById(“visa_error”).innerHTML = “”;
}}

if ((document.Form1.mastercard.value == “”) || (document.Form1.mastercard.value== null)) {
document.getElementById(“mastercard_error”).innerHTML = “”;
document.getElementById(“mastercard_paso”).innerHTML = “”;
}else{
if (!mastercard.match(/^5[1-5]\d{2}?\d{4}?\d{4}?\d{4}$/)){
document.getElementById(“mastercard_error”).innerHTML = “No es un número de MasterCard correcto”;
document.getElementById(“mastercard_paso”).innerHTML = “”;}
else{
document.getElementById(“mastercard_paso”).innerHTML = “Número de MasterCard correcto”;
document.getElementById(“mastercard_error”).innerHTML = “”;
}}

}

Validar Numero de tarjeta

VISA:
MasterCard:
Utilizar guiones para separar los numeros. No se permiten espacios.

gemral_cracken@yahoo.com.mx | obdc.com.mx

Artículo disponible en: http://lineadecodigo.com/2008/03/07/validar-numeros-de-tarjetas-de-credito-con-javascript/
lineadecodigo.com

Víctor Cuervo

oscar

Disculpa pero modifique tu codigo para implementarlo, el problema es que no corre en la porquería de IE, ya se que es una cochinada pero aqui no corre incluso usando el original como aqui dices.
ya lo proble en firefox y en chrome y si corre.

Víctor Cuervo

najim

yo la verdad no me he enterao de nada aver si me lo esplicas mas claro

Víctor Cuervo

Astua

No lei mucho el codigo pero por lo que veo no validas si las tarjetas
cumplen con el algoritmo Mod10, por lo tanto solo te validaria si cumplen con el largo y si son numeros, espero no equivocarme.

Gracias…

Víctor Cuervo

shadow

hola… me gustaria saber como puedo poner una restrigcion que me diga que es numero y ademas que es decimal… GRACIAS…

Los comentarios están cerrados.