zoukankan      html  css  js  c++  java
  • 银行卡号每隔4位插入空格

    难点不是插入空格,而是修正光标的位置,这个只支持IE9+

    <!DOCTYPE html>
    <html>
    
    <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()
                       //从左边沿到原坐标之间的空格数
                       var curSp = (curVal.slice(0, caret).match(/s/g) || []).length
                      //修正光标位置
                     this.selectionEnd = this.selectionStart = caret + curSp - sp
                   
                    }
                })
            })
        </script>
    </body>
    
    </html>
    
    
  • 相关阅读:
    zabbix+grafana使用
    其它工具网址
    IntelliJ IDEA 进行多线程调试
    mac外接显示器 双屏同时滑动问题
    wacher和acl
    zookeeper介绍
    iterm2用法与技巧
    linux下ssh公钥验证的设置和远程登录
    不变模式
    单例模式创建的三种方式
  • 原文地址:https://www.cnblogs.com/rubylouvre/p/6087353.html
Copyright © 2011-2022 走看看