Javascript 电话号码自动转换不起作用

标签 javascript jquery

我有一些像下面这样的 javascript 代码

function mask(eventVal,val){
    var len = val.value.length;
    var key = whichKey(eventVal);
    if(key>47 && key<58)
    {   
        if( len==0 )val.value=val.value+'('
        else if( len==4 )val.value=val.value+') '
        else if(len==9 )val.value=val.value+'-'
        else val.value=val.value;
    }
    else{
        val.value = val.value.replace(/[^0-9-]/,'')
        val.value = val.value.replace('--','-')
    }
}

function whichKey(eventVal) {
    var code;
    if (!eventVal) var eventVal = window.event;
    if (eventVal.keyCode) code = eventVal.keyCode;
    else if (eventVal.which) code = eventVal.which;
    return code;
}

HTML

<input type="text" name="PhoneNumber" id="PhoneNumber" value="" onkeydown="mask(event,this)"/>

当我输入电话号码时,它工作正常,例如 1234567890 自动转换为 (123) 456-7890 当我尝试删除值时,例如从末尾删除 0 然后格式被完全破坏。像 123) 456-789 甚至当我点击任何其他地方时它都会被毁掉。任何人都可以帮我解决它吗?

最佳答案

检查这个脚本..

<script language="javascript">
var zChar = new Array(' ', '(', ')', '-', '.');
var maxphonelength = 14;
var phonevalue1;
var phonevalue2;
var cursorposition;
function ParseForNumber1(object){
  phonevalue1 = ParseChar(object.value, zChar);
}
function ParseForNumber2(object){
  phonevalue2 = ParseChar(object.value, zChar);
}
function up(object,e) { 
  if(e){ 
    e = e 
  } else {
    e = window.event 
  } 
  if(e.which){ 
    var keycode = e.which 
  } else {
    var keycode = e.keyCode 
  }
  ParseForNumber1(object)
  if(keycode >= 48){
    ValidatePhone(object)
  }
}
function down(object,e) { 
  if(e){ 
    e = e 
  } else {
    e = window.event 
  } 
  if(e.which){ 
    var keycode = e.which 
  } else {
    var keycode = e.keyCode 
  }
  ParseForNumber2(object)
} 
function GetCursorPosition(){
  var t1 = phonevalue1;
  var t2 = phonevalue2;
  var bool = false
  for (i=0; i<t1.length; i++)
  {
    if (t1.substring(i,1) != t2.substring(i,1)) {
      if(!bool) {
        cursorposition=i
        window.status=cursorposition
        bool=true
      }
    }
  }
}
function ValidatePhone(object){
  var p = phonevalue1
  p = p.replace(/[^\d]*/gi,"")
  if (p.length < 3) {
    object.value=p
  } else if(p.length==3){
    pp=p;
    d4=p.indexOf('(')
    d5=p.indexOf(')')
    if(d4==-1){
      pp="("+pp;
    }
    if(d5==-1){
      pp=pp+")";
    }
    object.value = pp;
  } else if(p.length>3 && p.length < 7){
    p ="(" + p; 
    l30=p.length;
    p30=p.substring(0,4);
    p30=p30+") " 
    p31=p.substring(4,l30);
    pp=p30+p31;
    object.value = pp; 
  } else if(p.length >= 7){
    p ="(" + p; 
    l30=p.length;
    p30=p.substring(0,4);
    p30=p30+") " 

    p31=p.substring(4,l30);
    pp=p30+p31;

    l40 = pp.length;
    p40 = pp.substring(0,9);
    p40 = p40 + "-"

    p41 = pp.substring(9,l40);
    ppp = p40 + p41;

    object.value = ppp.substring(0, maxphonelength);
  }
  GetCursorPosition()
  if(cursorposition >= 0){
    if (cursorposition == 0) {
      cursorposition = 2
    } else if (cursorposition <= 2) {
      cursorposition = cursorposition + 1
    } else if (cursorposition <= 4) {
      cursorposition = cursorposition + 3
    } else if (cursorposition == 5) {
      cursorposition = cursorposition + 3
    } else if (cursorposition == 6) { 
      cursorposition = cursorposition + 3 
    } else if (cursorposition == 7) { 
      cursorposition = cursorposition + 4 
    } else if (cursorposition == 8) { 
      cursorposition = cursorposition + 4
      e1=object.value.indexOf(')')
      e2=object.value.indexOf('-')
      if (e1>-1 && e2>-1){
        if (e2-e1 == 4) {
          cursorposition = cursorposition - 1
        }
      }
    } else if (cursorposition == 9) {
      cursorposition = cursorposition + 4
    } else if (cursorposition < 11) {
      cursorposition = cursorposition + 3
    } else if (cursorposition == 11) {
      cursorposition = cursorposition + 1
    } else if (cursorposition == 12) {
      cursorposition = cursorposition + 1
    } else if (cursorposition >= 13) {
      cursorposition = cursorposition
    }

    var txtRange = object.createTextRange();
    txtRange.moveStart( "character", cursorposition);
    txtRange.moveEnd( "character", cursorposition - object.value.length);
    txtRange.select();
  }

}

function ParseChar(sStr, sChar)
{
  if (sChar.length == null) 
  {
    zChar = new Array(sChar);
  }
    else zChar = sChar;
  for (i=0; i<zChar.length; i++)
  {
    sNewStr = "";
    var iStart = 0;
    var iEnd = sStr.indexOf(sChar[i]);
    while (iEnd != -1)
    {
      sNewStr += sStr.substring(iStart, iEnd);
      iStart = iEnd + 1;
      iEnd = sStr.indexOf(sChar[i], iStart);
    }
    sNewStr += sStr.substring(sStr.lastIndexOf(sChar[i]) + 1, sStr.length);
    sStr = sNewStr;
  }
  return sNewStr;
}
</script>

HTML:

<input type="text" name="txtInput" onkeydown="javascript:down(this,event);" onkeyup="javascript:up(this,event);">

关于Javascript 电话号码自动转换不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13206190/

相关文章:

javascript - 检查网页是否不阻止包含在 iframe 中

javascript - 单击<a>时如何获取上一个文本框值?

javascript - Jquery Masking 返回 Float/Int 值

javascript - Angular 6 + keycloak 4,Javascript 库加载失败

javascript - 获取表属性的最后一行

javascript - 用 jQuery 包装 div

javascript - 当 div 显示为无时,jquery ui slider 滚动条不起作用

javascript - 鼠标悬停元素上的反向径向渐变 SVG 动画

javascript - 如何将一个数字包裹在 0 和 1 之间

c# - asp.net mvc 5 中的逗号小数点分隔符