从用户输入电话号码中提取子串使用Javascript

我从用户获取的电话号码输入为+ XXX-X-XXX-XXXX（+ XXX为国家代码），（X为城市代码），（XXX为前3位数字）和（XXX作为第4位数字）。我使用正则表达式来确认条目，如下面的代码所示：从用户输入电话号码中提取子串使用Javascript

function validate(form) { 
    var phone = form.phone.value; 
    var phoneRegex = /^(\+|00)\d{2,3}-\d{1,2}-\d{3}-\d{4}$/g; 
    //Checking 'phone' and its regular expressions 
    if(phone == "") { 
     inlineMsg('phone','<strong>Error</strong><br />You must enter phone number.',2); 
    return false; 
    } 
    if(!phone.match(phoneRegex)) { 
     inlineMsg('phone','<strong>Error</strong><br />Enter valid phone <br />+xxx-x-xxx-xxxx (or) <br />00xxx-x-xxx-xxxx.',2); 
    return false; 
    } 
    return true; 
}

它的工作很不错，但问题是，

编辑：如果用户输入如+ XXXXXXXXXXX（一起），并按下回车键或转到其他领域，根据输入它的自我设定到+ XXX-X-XXX-XXXX的正则表达式。

有人可以用一些例子指导我如何做这个任务。谢谢

来源

2012-04-21 AbdulAziz

我依稀记得一个jQuery插件，确实如此。虽然不记得名字，但尝试搜索。编辑：发现它：http://digitalbush.com/projects/masked-input-plugin/ – 2012-04-21 07:31:56

可能重复的[电话号码验证综合正则表达式]（http://stackoverflow.com/questions/123559/a-comprehensive -regex-for-phone-number-validation）（如果你不觉得这种情况，你应该澄清你的意思，“我希望用户输入+ XXXXXXXXXXX（all together），然后onblur（），它根据正则表达式自己设置它的输入“;不幸的是我们无法理解语法。） – ninjagecko 2012-04-21 07:32:05

@ninjagecko：它不是这个问题的重复。请在查找重复之前阅读该问题。 – 2012-04-21 07:33:34

设置元素的的onblur方法回调如下：

var isValidPhoneNumber = function(string) { 
    ... 
} 

var reformat = function(string) { 
    /* 
    * > reformat('example 123 1 1 2 3 123-45') 
    * "+123-1-123-1234" 
    */ 
    var numbers = string.match(/\d/g); 
    return '+' + [ 
     numbers.slice(0,3).join(''), 
     numbers.slice(3,4).join(''), 
     numbers.slice(4,7).join(''), 
     numbers.slice(7,11).join('') 
    ].join('-'); 
} 

var reformatPhoneNumber = function() { 
    var inputElement = this; 
    var value = inputElement.value; 

    if (isValidPhoneNumber(value)) 
     inputElement.value = reformat(inputElement.value); 
    else 
     // complain to user 
}

这里有两个例子的方式，你可以设置的onblur回调处理：

document.getElementById('yourinputelement').onblur = reformatPhoneNumber; 
<input ... onblur="reformatPhoneNumber"/>

你可以用更多的验证代码，如果增加reformatPhoneNumber你想要的，或只是不断验证数字，因为用户正在键入它。

只有当您的电话号码的格式为+ABCDEFGHIJK，然后在您的if语句中添加string.match(/^\+\d{11}$/)!==null时才能执行此操作。（^,$表示字符串的开始和结束，\+表示加号，并且\d表示数字0-9，正好重复{11}次）。具体来说：

function isPlusAndEleventDigits(string) { 
    /* 
    * Returns whether string is exactly of the form '+00000000000' 
    * where 0 means any digit 0-9 
    */ 
    return string.match(/^\+\d{11}$/)!==null 
}

来源

2012-04-21 09:17:02 ninjagecko

哇..它看起来很酷，让我检查，并会告诉你是否有任何问题。 – AbdulAziz 2012-04-21 10:18:31

尝试塑造输入：
result = subject.replace(/^((\+|00)\d{2,3})-?(\d{1,2})-?(\d{3})-?(\d{4})$/mg, "$1-$3-$4-$5");

然后做下一道工序。

来源

2012-04-21 07:53:14 Cylian

有什么好处？ – AbdulAziz 2012-04-21 08:04:57

根据我的理解，您必须根据“+ XXX-XX-XXX-XXXX”按照结果替换“subject”来形成inputString（即“subject”） ''，你会得到一个适当的结构你的字符串。然后检查数据。 – Cylian 2012-04-21 08:28:10

您的意思是我现在不必使用JQuery？你是什么意思“然后检查数据”？ – AbdulAziz 2012-04-21 08:35:14

从用户输入电话号码中提取子串使用Javascript

回答

相关问题