带有正则表达式的文本字段的电话掩码

Question

我正在使用此功能进行电话屏蔽，并且几乎可以完美运行。

function mask(o, f) 
{ 
    v_obj = o; 
    v_fun = f; 
    setTimeout("execmask()", 1) 
};

function execmask() 
{ 
    v_obj.value = v_fun(v_obj.value) 
};

function mphone(v){
    v=v.replace(/\D/g,"");           
    v=v.substring(0, 11);
    v=v.replace(/^(\d{2})(\d)/g,"(OXX$1) $2"); 
    v=v.replace(/(\d)(\d{4})$/,"$1-$2"); 
    return v;
}

这里我在文本字段中运行掩码：

<input type="text" id="phone" name="phone" onkeypress="mask(this, mphone);" onblur="mask(this, mphone);" />

问题是我需要把这部分代码(OXX$1)改成(0XX$1)。

目前情况：

No. Of Digits	Input Field
9 digit	(OXX99) 99999-9999
8 digit	(OXX99) 9999-9999

我需要的正确格式：

No. Of Digits	Input Field
9 digit	(0XX99) 99999-9999
8 digit	(0XX99) 9999-9999

8位或9位的数量是用户的选择。

将O 更改为0，会导致掩码出错。

Answer 1

function mask(o, f) {
    setTimeout(function () {
        var v = f(o.value);
        if (v != o.value) {
            o.value = v;
        }
    }, 1);
}

function mphone(v) {
    var r = v.replace(/\D/g,"");
    r = r.replace(/^0/,"");
    if (r.length > 10) {
        // 11+ digits. Format as 5+4.
        r = r.replace(/^(\d\d)(\d{5})(\d{4}).*/,"(0XX$1) $2-$3");
    }
    else if (r.length > 5) {
        // 6..10 digits. Format as 4+4
        r = r.replace(/^(\d\d)(\d{4})(\d{0,4}).*/,"(0XX$1) $2-$3");
    }
    else if (r.length > 2) {
        // 3..5 digits. Add (0XX..)
        r = r.replace(/^(\d\d)(\d{0,5})/,"(0XX$1) $2");
    }
    else {
        // 0..2 digits. Just add (0XX
        r = r.replace(/^(\d*)/, "(0XX$1");
    }
    return r;
}

http://jsfiddle.net/BBeWN/

Answer 2

我做了一些改动：

1. 我将事件更改为 keyup（除了 keypress 已被弃用的事实之外），因为 keypress 总是使用少一个字符的字符串，并且我还需要 onblur，这是 keyup 不会发生的事情。需要调整代码来解决此问题
2. 以及“-”的问题，当尝试使用退格键删除它时，它总是返回。

fiddle

  function mascaraFone(event) {
    var valor = document.getElementById("telefone").attributes[0].ownerElement['value'];
    var retorno = valor.replace(/\D/g, "");
    retorno = retorno.replace(/^0/, "");
    if (retorno.length > 10) {
      retorno = retorno.replace(/^(\d\d)(\d{5})(\d{4}).*/, "($1) $2-$3");
    } else if (retorno.length > 5) {
      if (retorno.length == 6 && event.code == "Backspace") { 
        // necessário pois senão o "-" fica sempre voltando ao dar backspace
        return; 
      } 
      retorno = retorno.replace(/^(\d\d)(\d{4})(\d{0,4}).*/, "($1) $2-$3");
    } else if (retorno.length > 2) {
      retorno = retorno.replace(/^(\d\d)(\d{0,5})/, "($1) $2");
    } else {
      if (retorno.length != 0) {
        retorno = retorno.replace(/^(\d*)/, "($1");
      }
    }
    document.getElementById("telefone").attributes[0].ownerElement['value'] = retorno;
  }

<input id="telefone" onkeyup="mascaraFone(event)" />

Answer 3

我喜欢这个功能，我一直在使用它。如果有人需要，我已经添加了另外 2 个面具。我知道他们不会直接回答这个问题，但它们非常有用。

//Social Security Number for USA
 function mssn(v) {
    var r = v.replace(/\D/g,"");
    r = r.replace(/^0/,"");
    if (r.length > 9) {
        r = r.replace(/^(\d\d\d)(\d{2})(\d{0,4}).*/,"$1-$2-$3");
        return r;
    }
    else if (r.length > 4) {
        r = r.replace(/^(\d\d\d)(\d{2})(\d{0,4}).*/,"$1-$2-$3");
    }
    else if (r.length > 2) {
        r = r.replace(/^(\d\d\d)(\d{0,3})/,"$1-$2");
    }
    else {
        r = r.replace(/^(\d*)/, "$1");
    }
    return r;
}

//USA date
function mdate(v) {
   var r = v.replace(/\D/g,"");
   if (r.length > 4) {
    r = r.replace(/^(\d\d)(\d{2})(\d{0,4}).*/,"$1/$2/$3");
   }
   else if (r.length > 2) {
    r = r.replace(/^(\d\d)(\d{0,2})/,"$1/$2");
   }
   else if (r.length > 0){
         if (r > 12) {
           r = "";
         }
   }
   return r;
}