web-dev-qa-db-fra.com

validation des entrées de carte de crédit à l'aide d'une expression régulière en javascript

J'ai essayé de faire cela mais sans succès. J'utilise une expression régulière pour valider le numéro de carte de crédit entré par l'utilisateur en fonction du type de carte de crédit sélectionné via le bouton radio. Mais je tiens à avoir l'alerte pour la déclaration all if . Il semble que toutes les instructions si autrement sont testées. 

There is the HTML code fragment: 

<code>
<p><b>Payment Information:</b></p>
         <fieldset>
            <input type="radio" name="payment" value="Visa" id="visa" />Visa &nbsp;
            <input type="radio" name="payment" value="Master Card" />Master Card &nbsp;
            <input type="radio" name="payment" value="American Express" />American Express &nbsp;
            <input type="radio" name="payment" value="Discover" />Discover <br /><br />
            <label>Card Number:</label>
            <input type="text" name="cardNumber" id="cardNum" size="30" value="" onblur="ValidateCreditCardNumber()" />
</code>



And there is my javascript function :

<code>

function ValidateCreditCardNumber(){

    var ccNum = document.getElementById("cardNum").value;



    var visaRegEx = /^(?:4[0-9]{12}(?:[0-9]{3})?)$/;
    var mastercardRegEx = /^(?:5[1-5][0-9]{14})$/;
    var amexpRegEx = /^(?:3[47][0-9]{13})$/;
    var discovRegEx = /^(?:6(?:011|5[0-9][0-9])[0-9]{12})$/; 


    if (visaRegEx.test(ccNum) === false ){ // Visa validation
       alert("Please provide a valid Visa number!");   
        }  
      else  
        {  
         alert("Thank You!");  
        }  

    if (mastercardRegEx.test(ccNum) === false){ // MasterCard validation
        alert("Please provide a valid MasterCard number!");  
        }  
      else  
        {  
        alert("Thank You!");  
        } 

    if(amexpRegEx.test(ccNum) === false){ // Amex  validation
        alert("Not a valid America Express number!");  
        }  
      else  
        {   
        alert("Thank You!");  
        } 

    if (discovRegEx.test(ccNum) === false){ // Discover validation
        alert("Please provide a valid Discover number!"); 
        }  
      else  
        {  
        alert("Thank You!");  
        } 


    }
</code>


Any kind of help or advice would be really appreciated.
javascriptregex
8
Cyrille

Vous avez 4 blocs if différents dans votre cas, qui frappe chaque bloc lorsque le précédent échoue.

Remplacez if par if else, de cette manière si vous ne validez que pour un cas d'utilisation unique . Vous n'avez pas non plus besoin d'indiquer à l'utilisateur le type de carte qu'il tente d'entrer. Un seul message pour entrer un numéro valide devrait suffire.

function ValidateCreditCardNumber() {

  var ccNum = document.getElementById("cardNum").value;
  var visaRegEx = /^(?:4[0-9]{12}(?:[0-9]{3})?)$/;
  var mastercardRegEx = /^(?:5[1-5][0-9]{14})$/;
  var amexpRegEx = /^(?:3[47][0-9]{13})$/;
  var discovRegEx = /^(?:6(?:011|5[0-9][0-9])[0-9]{12})$/;
  var isValid = false;

  if (visaRegEx.test(ccNum)) {
    isValid = true;
  } else if(mastercardRegEx.test(ccNum)) {
    isValid = true;
  } else if(amexpRegEx.test(ccNum)) {
    isValid = true;
  } else if(discovRegEx.test(ccNum)) {
    isValid = true;
  }

  if(isValid) {
     alert("Thank You!");
  } else {
     alert("Please provide a valid Visa number!");
  }
}
13
Sushanth --

Changez votre logique en ceci:

<script type="text/javascript">

// Store the regexes as globals so they're cached and not re-parsed on every call:
var visaPattern = /^(?:4[0-9]{12}(?:[0-9]{3})?)$/;
var mastPattern = /^(?:5[1-5][0-9]{14})$/;
var amexPattern = /^(?:3[47][0-9]{13})$/;
var discPattern = /^(?:6(?:011|5[0-9][0-9])[0-9]{12})$/; 

function validateCreditCardNumber() {

    var ccNum  = document.getElementById("cardNum").value;

    var isVisa = visaPattern.test( ccNum ) === true;
    var isMast = mastPattern.test( ccNum ) === true;
    var isAmex = amexPattern.test( ccNum ) === true;
    var isDisc = discPattern.test( ccNum ) === true;

    if( isVisa || isMast || isAmex || isDisc ) {
        // at least one regex matches, so the card number is valid.

        if( isVisa ) {
            // Visa-specific logic goes here
        }
        else if( isMast ) {
             // Mastercard-specific logic goes here
        }
        else if( isAmex ) {
            // AMEX-specific logic goes here
        }
        else if( isDisc ) {
            // Discover-specific logic goes here
        }
    }
    else {
        alert("Please enter a valid card number.");
    }
}

</script>
1
Dai

Cela devrait faire le travail

var cc = /^(?:4[0-9]{12}(?:[0-9]{3})?|5[1-5][0-9]{14}|(222[1-9]|22[3-9][0-9]|2[3-6][0-9]{2}|27[01][0-9]|2720)[0-9]{12}|6(?:011|5[0-9][0-9])[0-9]{12}|3[47][0-9]{13}|3(?:0[0-5]|[68][0-9])[0-9]{11}|(?:2131|1800|35\d{3})\d{11}|62[0-9]{14})$/

cc.test(card_number)

Source: repo vee-validate

0
Adam F