银行卡
手机号
HTML
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=yes" /> <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> </head> <body> <input type="text" name="bankNumber" id="bankNumber"/> </body> </html> <script src="js/cutNumber.js"></script> <script> $("#bankNumber").cutNumber({type:"phone"}); </script>
JS
/*
模拟手机和银行卡号间隔效果插件
如果银行卡 传参 {type:"bank"}
如果是手机 传参 {type:"phone"}
*/
;(function ($) {
$.fn.extend({
"cutNumber": function (options) {
if (!isValid(options))
return this;
//使用jQuery.extend 覆盖插件默认参数
var opts = $.extend({}, options);
//如果是银行使用，会执行444格式
if(opts.type =="bank"){
$(this).prop({maxlength:23});
return this.on("keyup",function(){
this.value =this.value.replace(/s/g,'').replace(/D/g,'').replace(/(d{4})(?=d)/g,"$1 ");
})
}else if(opts.type =="phone"){
$(this).prop({maxlength:13});
return this.on("keyup",function(){
this.value =this.value.replace(/s/g,'').replace(/D/g,'').replace(/(d{3})(?=d)/,'$1 ').replace(/(d{4})(?=d)/,'$1 ');
})
}else{
return this.on("keyup",function(){
this.value = this.value;
})
}
}
});
//私有方法，检测参数是否合法
function isValid(options) {
return !options || (options && typeof options === "object") ? true : false;
}
})(window.jQuery);