链接

输入4为数字, 再输入一个数字调试一下就能看懂了

<head lang="en">
<meta charset="UTF-8">
<title>银行卡号4位空格</title>
<script src="http://j2.58cdn.com.cn/js/jquery-1.8.3.js"></script>
</head> <body>
<input type="text" id="kahao" />
<script>
$(function() { $('#kahao').on('keyup', function(e) {
//只对输入数字时进行处理
if((e.which >= 48 && e.which <= 57) ||
(e.which >= 96 && e.which <= 105 )){
//获取当前光标的位置
var caret = this.selectionStart
//获取当前的value
var value = this.value
//从左边沿到坐标之间的空格数, 计算原来有几个空格
var sp = (value.slice(0, caret).match(/\s/g) || []).length
//去掉所有空格
var nospace = value.replace(/\s/g, '')
//重新插入空格
var curVal = this.value = nospace.replace(/(\d{4})/g, "$1 ").trim() //主要这里"$1 " 加了一个空格
//从左边沿到原坐标之间的空格数, 重新赋值后有几个空格
var curSp = (curVal.slice(0, caret).match(/\s/g) || []).length
//修正光标位置
this.selectionEnd = this.selectionStart = caret + curSp - sp }
})
})
</script>
</body> </html>

  

支付宝为了兼容 和 易用性, 是在悬浮一个提示框分开卡号的, 这种也比较容易实现

如图 

银行卡号每隔4位插入空格 (再用户填写银行卡号的时候挺有用的) IE9+的更多相关文章

  1. C#银行卡号每隔4位数字加一个空格

    1.填写银行卡号每隔4位数字加一个空格 Regex.Replace(dic["BankCardNo"].ToString(), @"(\d{4}(?!$))", ...

  2. vue项目中的字符串每隔4位一个空格

    项目中遇到现实银行卡号的需求所以需要这个方法 我们这里运用 JavaScript replace()方法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子 ...

  3. jQuery实现18位身份证输入隔位添加空格及格式验证

    说明:jQuery实现身份证输入添加空格,表单验证身份证输入,并且输入时前6位添加一个空格,中间8位后添加一个空格,及身份证格式验证 参考:基于jquery实现的银行卡号每隔4位自动插入空格的实现代码 ...

  4. javascript在一个字符串中每隔多少字符插入某个字符串

    function insertStr(str,tar,n,m){ var x='' var str=str.split('') if(str.length==0) return for(var i=n ...

  5. 如何在Markdown文档中插入空格?

    简单说 在 Markdown 文档中,可以直接采用 HTML 标记插入空格(blank space),而且无需任何其他前缀或分隔符.具体如下所示: 插入一个空格 (non-breaking space ...

  6. 在HTML代码中要如何插入空格?

    超文本标记语言(HTML)会自动忽略空格.平常在编写代码的时候,用空格键.Tab键以及回车键产生的空格,都会被HTML自动忽略.那么我们该用什么方法来实现HTML的空格效果呢?有专门的空格代码吗?不少 ...

  7. MathType插入空格

    公式太长,换行后加一些空格,继续录. 将鼠标定位到需要插入空格的位置,此时如果直接按空格键,你会发现并不能插入空格.正确的输入方法有两种: 方法一,在菜单栏中[样式]菜单下选择[文本],随后按空格键即 ...

  8. 某input元素值每隔三位添加逗号跟去掉逗号

    //每隔三位数字加一个逗号function moneyformat(s) {    var reg = /.*\..*/;    if (reg.test(s) == true) {        n ...

  9. js正则实现用户输入银行卡号的控制及格式化

    //js正则实现用户输入银行卡号的控制及格式化 <script language="javascript" type="text/javascript"& ...

随机推荐

  1. public boolean onKeyDown(int keyCode, KeyEvent event)

    @Override 2 public boolean onKeyDown(int keyCode, KeyEvent event) { 3 // TODO Auto-generated method ...

  2. java的==和equal的区别(一)

    java的==和equal的区别 “==”是用来比较两个String对象在内存中的存放地址是否相同的.例如, 1 2 3 4 5 6 7 8 9 String test1 = "test&q ...

  3. Linux系统——ssh-key连接原理

    SSH是一种客户端连接,在Linux服务器下通过远程的方式将本地电脑连接到对方的电脑上. 远程连接的方式: (1)telnet命令(为明文传输,不安全) (2)(2)SSH(加密传输,安全) 操作的两 ...

  4. 工作记录之开发HRM项目总结

    开发HRM项目的步骤: 1:首先保留HRM项目中的两张表(Employee,Position)把这两张表中的数据内容复制到Operator-Portlet这个项目中,这两张表的service.xml配 ...

  5. 028-B+树(一)

    B+ 树 这部分主要学习:什么是B+树? 了解了 B 树后再来了解下它的变形版:B+ 树,它比 B 树的查询性能更高. 一棵 B+ 树需要满足以下条件: 节点的子树数和关键字数相同(B 树是关键字数比 ...

  6. LFD,非官方的Windows二进制文件的Python扩展包

    LFD,非官方的Windows二进制文件的Python扩展包 LFD,非官方版本.32和64位.Windows.二进制文件.科学开源.Python扩展包 克里斯托夫·戈尔克(by Christoph ...

  7. hdu 5185 动态规划 分析降低复杂度

    这题说的是 x[1]+x[2]+x[3]+…+x[n]=n, 这里 0 <= x[i] <= n && 1 <= i <= n x[i] <= x[i+1 ...

  8. pycharm添加git ignore

    pycharm现在提供了git ignore,很方便 从这里下载扩展 https://plugins.jetbrains.com/plugin/7495--ignore 放到pycharm根目录\pl ...

  9. MySQL "tinyInt1isBit or tinyint(1)" 相关问题解析

    问题描述 tinyInt 的数据类型,在JAVA数据类型 和 MySQL的数据类型转换,要注意存储长度为 1 的情况.查询时,该字段对应的Java类型为Boolean 源数据: 读取后数据: 问题分析 ...

  10. android的hook方面知识点

    android hook分为另种: native层hook---理解ELF文件 java层---虚拟机特性和Java上的反射的作用 注入代码: 存放在哪? 用mmap函数分配临时内存来完成代码存放,对 ...