javascript - 添加输入的电话号码验证

Question

我最近填写了一个表格，当我输入电话号码文本框时，我注意到发生了一些非常酷的事情。当我输入我的号码时，系统会自动添加通用电话符号。示例:

我开始输入我的区号“555”

并且我的输入更改为 1 (555)

为了测试刚刚发生的事情，我在 ) 上退格，它很快又把它加回去了。

所以我的问题是，如何让这个输入发生？

Answer 1

我使用一个名为 automask 的 javascript 库 - 你看不到掩码，但它不会让你在掩码之外输入任何内容

例如，如果您的掩码是###-###-####，那么任何其他字符都将被忽略(即不是 0-9)并且破折号会自动放入。

如果你想看一下，我可以发布图书馆

实现示例

<input type=text name=ssn onkeypress="return autoMask(this,event, '###-##-####');">

// email kireol at yahoo.com
// autoMask - an adaption of anyMask
// 
// this will force #'s, not allowing alphas where the #'s are, and auto add -'s
function autoMask(field, event, sMask) {
    //var sMask = "**?##?####";<p></p>

<pre><code>var KeyTyped = String.fromCharCode(getKeyCode(event));
var targ = getTarget(event);
keyCount = targ.value.length;
if (getKeyCode(event) < 32)
{
    return true;
}
if(keyCount == sMask.length && getKeyCode(event) > 32)
{
    return false;
}
if ((sMask.charAt(keyCount+1) != '#') && (sMask.charAt(keyCount+1) != 'A' ) && (sMask.charAt(keyCount+1) != '~' ))
{
    field.value = field.value + KeyTyped + sMask.charAt(keyCount+1);
    return false;
}

if (sMask.charAt(keyCount) == '*')
    return true;

if (sMask.charAt(keyCount) == KeyTyped)
{
    return true;
}

if ((sMask.charAt(keyCount) == '~') && isNumeric_plusdash(KeyTyped))
    return true;

if ((sMask.charAt(keyCount) == '#') && isNumeric(KeyTyped))
    return true;

if ((sMask.charAt(keyCount) == 'A') && isAlpha(KeyTyped))
    return true;

if ((sMask.charAt(keyCount+1) == '?') )
{
    field.value = field.value + KeyTyped + sMask.charAt(keyCount+1);
    return true;
}
return false;
</code></pre>

<p>}
function getTarget(e) {
    // IE5
    if (e.srcElement) {
        return e.srcElement;
    }
    if (e.target) {
        return e.target;
    }
}</p>

<p>function getKeyCode(e) {
    //IE5
    if (e.srcElement) {
        return e.keyCode
    }
    // NC5
    if (e.target) {
        return e.which
    }
}</p>

<p>function isNumeric(c)
{
    var sNumbers = "01234567890";
    if (sNumbers.indexOf(c) == -1)
        return false;
    else
        return true;</p>

<p>}</p>

<p>function isNumeric_plusdash(c)
{
    var sNumbers = "01234567890-";
    if (sNumbers.indexOf(c) == -1)
        return false;
    else
        return true;</p>

<p>}</p>

<p>function isAlpha(c)
{
    var lCode = c.charCodeAt(0);
    if (lCode >= 65 && lCode <= 122 )
    {
        return true;
    }
    else
        return false;
}</p>

<p>function isPunct(c)
{
    var lCode = c.charCodeAt(0);
    if (lCode >= 32 && lCode <= 47 )
    {
        return true;
    }
    else
        return false;</p>

<p>}</p>

<p></p>