Javascript 创建信用卡输入。为什么表单不在4位数的信用卡上添加破折号?
我正在尝试创建一个信用验证表单。无论输入字段是什么,它的最大值都应该是19位,并且有4位数字,用破折号分隔。到目前为止,我可以在打字的同时进行粘贴,但粘贴不起作用,编辑一些数字也不起作用,表单不会更新 我不想使用任何插件,我的客户只使用万事达卡和Visa卡,这就是为什么他们要求19位数字 到目前为止,我还尝试将代码放入循环中,但循环仍然不能用于复制粘贴和其他场景Javascript 创建信用卡输入。为什么表单不在4位数的信用卡上添加破折号?,javascript,jquery,Javascript,Jquery,我正在尝试创建一个信用验证表单。无论输入字段是什么,它的最大值都应该是19位,并且有4位数字,用破折号分隔。到目前为止,我可以在打字的同时进行粘贴,但粘贴不起作用,编辑一些数字也不起作用,表单不会更新 我不想使用任何插件,我的客户只使用万事达卡和Visa卡,这就是为什么他们要求19位数字 到目前为止,我还尝试将代码放入循环中,但循环仍然不能用于复制粘贴和其他场景 var cc=$(“#cc card”); //起动回路 setInterval(函数(){ jQuery(cc).on('prop
var cc=$(“#cc card”);
//起动回路
setInterval(函数(){
jQuery(cc).on('propertychange单击模糊更改键Up键Down粘贴',函数(){
var cctlength=jQuery(this).val().length;
//输出应始终为0000-0000-0000-0000
开关(cctlength){
案例4:
var cctVal=jQuery(this.val();
var cctNewVal=cctVal+'-';
jQuery(this.val)(cctNewVal);
打破
案例9:
var cctVal=jQuery(this.val();
var cctNewVal=cctVal+'-';
jQuery(this.val)(cctNewVal);
打破
案例14:
var cctVal=jQuery(this.val();
var cctNewVal=cctVal+'-';
jQuery(this.val)(cctNewVal);
打破
违约:
打破
}
});
//端环
}, 100);代码>
首先,您不需要使用setInterval
,只要在输入值更改时更新(使用事件)
第二,当用户添加一个值时,你将它分成4块,并在中间插入-
最后,每次读取一个值时,可以去掉所有非数字字符,这将删除添加的-
,以及用户可能添加的任何其他字符
注意:如果用户在字符串末尾之前编辑了一个数字,您还必须重置光标位置,因为更新值会自动将光标移到末尾
const cc=$(“#cc card”);
函数chunksOf(字符串、大小){
var i,j,arr=[];
对于(i=0,j=string.length;i
输入信用卡:
为什么不使用类似于.replace(/(.{4})/g,“$1-”)的东西代码>示例“1234567898765432”。替换(/(.{4})/g,“$1-”)。子字符串(0,19)代码>不要使用设置间隔!哎呀@NewToJS我试过并更新到这个;-“似乎涵盖了一切?”布莱克本小子说,“好吧,这似乎很好。”。。即使粘贴到输入中。唯一的问题是用新值更新输入。@NewToJS如何自我更新输入字段?看看我最新的小提琴吧,它只是坏了:你的代码和逻辑真的很好。但是您不能在字段中按CTRL/CMD粘贴,因此自动填充将不起作用,并且用户不能使用光标在数字之间进行编辑,因为它会替换其他数字。。我将我的小提琴更新为:@TheBlackBenzKid我通过使用输入
事件解决了这个问题。查看我的最新编辑唯一的问题仍然是用户无法使用光标和编辑以前的数字4444-4445-4444-4444尝试编辑数字5,它会将光标类型移到末尾?@TheBlackBenzKid每次都可以重置光标位置,我添加了一个示例