Insert space after certain character into javascript string

前端 未结 2 1465
一向
一向 2020-12-04 01:29

I\'m working on a form and I\'d like to mask the input of the phone numbers. The plugins what I found aren\'t okay for me since the area code could be 1 or 2 character long.

相关标签:
2条回答
  • 2020-12-04 01:51

    You could do something like this:

    http://jsfiddle.net/ffwAA/4/

    Which applies this function to the string to get the desired formatting:

    function formatCode(str){
        var result = str;
    
        str = str.replace(/\D+/g, "");
        var m = str.match(/^(\d\d)(?:([2-90]\d|1)(?:(\d\d\d)(\d+)?)?)?$/);
    
        if(m){
            result = m[1] + " ";
            if(m[2]) result += m[2] + " ";
            if(m[3]) result += m[3] + " ";
    
            if(m[4]){
                result += m[4].split(/(\d{4})/).join(" ");
                result = result.replace(/\s+/g, " ");
            }
        }
    
        return result;
    }
    

    And using this jQuery to set it up:

    function update(obj){
        var val = obj.value;
        var got = formatCode(val);
    
        if(got != val)
            obj.value = got;
    }
    
    var timer;
    var prev_val = "";
    
    $('#code').keyup(function(){
        clearTimeout(timer);
    
        // when adding numbers at the end of input, update at once
        // don't want to update when editing in the middle of the string or removing parts of it
        // because it would move the carret location to the end of input, and make it unusable
        if(this.value.indexOf(prev_val) == 0){
            update(this);
            prev_val = this.value;
            return;
        }
    
        prev_val = this.value;
    
        // in other cases update 1 second after the changes are done
        timer = setTimeout(update, 1000, this);
    });
    
    0 讨论(0)
  • 2020-12-04 02:00

    Have you tried the maskedInput plugin?

    http://digitalbush.com/projects/masked-input-plugin/

    I think it can solve your problem.

    Hope this helps. Cheers

    0 讨论(0)
提交回复
热议问题