BankInput bank card account formatting based on jquery

BankInput bank card account formatting based on jquery_jquery

WBOY

Release： 2016-05-16 17:50:22

Original

1410 people have browsed it

The jquery bankInput plug-in is a formatted display of bank cards. It can control the minimum and maximum number of inputs in the text box, control only the input of numbers, control not pasting, and the use of input methods. At the same time, the plug-in can automatically load formatted display and support formatted display of non-input boxes.

Copy code The code is as follows:

1. Default usage:
$("#account").bankInput();
2. Set parameters
$ ("#account").bankInput({min:16,max:25,deimiter,' '});
3. Non-text box formatted display
$(".account").bankList() ;

Copy code The code is as follows:

 
/**
× JQUERY simulates Taobao control bank account input 
* @Author 312854458@qq.com Rising Sun 
**/ 
 (function($){ 
//Input box formatting
$.fn.bankInput = function(options){ 
var defaults = { 
min : 10, // Minimum number of input characters
max : 25, // Maximum number of characters to enter
deimiter : ' ', // Account delimiter
onlyNumber : true, // Only numbers can be entered
copy : true // Allow copying
} ; 
var opts = $.extend({}, defaults, options); 
var obj = $(this); 
obj.css({imeMode:'Disabled',borderWidth:'1px', color:'#000',fontFamly:'Times New Roman'}).attr('maxlength', opts.max); 
if(obj.val() != '') obj.val( obj.val ().replace(/s/g,'').replace(/(d{4})(?=d)/g,"$1" opts.deimiter) ); 
obj.bind('keyup' ,function(event){ 
if(opts.onlyNumber){ 
if(!(event.keyCode>=48 && event.keyCode<=57)){ 
this.value=this.value. replace(/D/g,''); 
} 
} 
this.value = this.value.replace(/s/g,'').replace(/(d{4}) (?=d)/g,"$1" opts.deimiter); 
}).bind('dragenter',function(){ 
return false; 
}).bind('onpaste', function(){ 
return !clipboardData.getData('text').match(/D/); 
}).bind('blur',function(){ 
this.value = this. value.replace(/s/g,'').replace(/(d{4})(?=d)/g,"$1" opts.deimiter); 
if(this.value.length < opts.min){ 
alertMsg.warn('Enter at least 'opts.min' account information! '); 
obj.focus(); 
} 
}) 
} 
// List display formatting
$.fn.bankList = function(options){ 
var defaults = { 
deimiter : ' ' // delimiter
}; 
var opts = $.extend({}, defaults, options); 
return this.each(function() { 
$(this).text($(this).text().replace(/s/g,'').replace(/(d{4})(?=d)/g,"$1 " opts.deimiter)); 
}) 
} 
})(jQuery); 