js如何实现卡号自动粘贴效果?

如下图所示的四个输入框,需要用户填入16位长的卡号,每个输入框中填写4位,使用js如何实现当用户在第一个框粘贴一个16位字符串时,自动将这16位字符串填充到输入框中,每个框4个字符:

请输入图片描述

如用户的复制的卡号是ABCDEFGH8MKNO2P9,当在第一框按crtl+v粘贴后,自动将这16位的卡号填充到各输入框中,如下图所示:

请输入图片描述

评论 (0)链接2012-09-11 

1.监听ctrl+v键盘事件

2.获取剪贴板内容

3.substring成4份,分别放到四个框里

该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2012-09-12

第一个框的onchange里面,如果是直接变成了16位字符串,就分割成四个4字符然后赋给其他框;否则如果长度>=4,就截断到4然后切换到下一个框。

该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2012-09-12

给你个例子吧
JS代码,使用jquery框架

  
var ctrl = false;
$(function(){
$('.cf').keydown(function(e){
if(e.keyCode==17)
{
ctrl = true;
}
});
$('.cf').keyup(function(e){
if(e.keyCode==17)
{
ctrl = false;
}
if(ctrl && e.keyCode==86)
{//粘贴完成之后
var text = $(this).val();
MyChaiFei(text,$(this));
}
});
})
function MyChaiFei(text,jqobj)
{
jqobj.focus();
var len = text.length;
if(len>4)
{
jqobj.val(text.substr(0,4));
text = text.substr(4);
var next = jqobj.next('.cf');
if(next.size()>0)
MyChaiFei(text,next);
}
else
{
jqobj.val(text);
}
}

HTML代码为

  
<input type="text" class="cf" />
<input type="text" class="cf" />
<input type="text" class="cf" />
<input type="text" class="cf" />
该答案已被锁定,无法对其进行评论,编辑及投票。
()
评论 (0)链接 • 2013-01-21
德问是一个专业的编程问答社区,请 登录注册 后再提交答案