原生js实现银行卡号每隔4位数字加一个空格案例

妖狐艹你老母 2022-06-12 02:48 254阅读 0赞

<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8">
            <title>原生js实现银行卡号每隔4位数字加一个空格案例</title>
        </head>
        <body>
            <input type="text" name="card"/>
        </body>
        <script>
            var card = document.getElementsByName('card')[0];
            card.onkeyup = function(event){
                var code = event.keyCode;
                var text = card.value.replace(/\s/g, '');//获取输入框的内容，并把空格替换为''
                /^\d+$/.test(text) || judgeKey(code) || alert('对不起!银行卡号格式不对!');
                if(code > 48 && code < 57 || code > 96 && code < 105){//按下的是数字键
                    this.value = text.replace(/(\d{4})/g, "$1 ");
                }
            }
    
            //判断是否是Home、End、上、下、左、右、退格、删除键
            function judgeKey(code){
                return in_array(code,[35,36,37,38,39,40,8,46]);
            }
    
            //封装一个判断元素是否在数组中的函数，类似于PHP的in_array函数
            function in_array(search,array){
                array instanceof Array || alert(array + '不是一个数组!');//判断是否是数组
                for(var i in array){
                    if(array[i] == search){
                        return true;
                    }
                }
                return false;
            }
        </script>
    </html>

PS:本文有任何错误，或有任何疑问，欢迎批评指出。