credit card input validation using regular expression in javascript

后端 未结 3 613
北恋
北恋 2021-02-14 12:35

I\'ve been trying to get this done but no success. I am using regular expression to validate the credit card number entered by user based on the type of credit card selected thr

相关标签:
3条回答
  • 2021-02-14 12:55

    Change your logic to this:

    <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>
    
    0 讨论(0)
  • 2021-02-14 13:12

    This should do the job

    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: vee-validate repo

    0 讨论(0)
  • 2021-02-14 13:21

    You have 4 different if blocks in your case, which hits every single block when the previous once fail.

    Replace if with if else, that way if will only validate for a single use case. Also you need not let the user know to be specific about the type of card that he is trying to enter. Just a single message to enter a valid number should suffice.

    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!");
      }
    }
    
    0 讨论(0)
提交回复
热议问题