Skip to content

Instantly share code, notes, and snippets.

@rwaldron

rwaldron/DetectCreditCardType

Created December 8, 2010 01:52
Show Gist options
  • Save rwaldron/732777 to your computer and use it in GitHub Desktop.
Save rwaldron/732777 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
DetectCreditCardType
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Detect Credit Card Type</title>
</head>
<body>
<form>
<label for="card_number">Enter Card Number:</label>
<input type="text" name="card_number" id="card_number" value="">
<div id="card"></div>
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<script>
$(document).ready(function() {
// Listen for keyup on card_number field
$('#card_number').live('keyup', function(e) {
// Stop bubbling
e.stopPropagation();
// Strip whitespace - pattern from http://bit.ly/dTLIkO
var num = $(this).val().replace(/[\s\xA0]+/g, ""),
len = num.length,
type;
// Determine card type - patterns from http://www.merriampark.com/anatomycc.htm
if ( (/^4/.test(num)) && (/^(13|16)$/.test(len)) ) {
type = 'Visa';
} else if ( (/^(34|37)/.test(num)) && (/^15$/.test(len)) ) {
type = 'American Express';
} else if ( (/^5[1-5]/.test(num)) && (/^16$/.test(len)) ) {
type = 'Mastercard';
} else if ( (/^6011/.test(num)) && (/^16$/.test(len)) ) {
type = 'Discover';
} else {
type = 'type unknown';
}
// Replace the contents of <div id=card> with the card name.
$('#card').html(type);
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment