JS填写银行卡号每隔4位数字加一个空格
网络编程 2025-03-28 18:36www.168986.cn编程入门
关于JS自动为银行卡号添加空格的小技巧
当你在处理网页中的银行卡号输入时,有没有想过如何让用户在输入过程中,每隔4位数字就自动添加一个空格呢?这是一个很实用的功能,能够提高用户体验。下面,我将为你展示如何使用原生JS和jQuery来实现这一功能。
原生JS实现方式:
```javascript
!function () {
var bankCardInput = document.getElementById('bankCard');
bankCardInput.onkeyup = function (event) {
var value = this.value;
if (/\S{5}/.test(value)) { // 当输入连续5个非空白字符时
this.value = value.replace(/\s/g, '').replace(/(.{4})/g, '$1 '); // 移除所有空格,并在每4位数字后添加空格
}
};
}();
```
jQuery实现方式:
如果你是jQuery的爱好者,可以使用下面的代码来实现相同的功能:
```html