Question

我是JavaScript新手，我一直在做一些用HTML和JavaScript创建表单的工作。在这项工作中，我一直在尝试根据输入到前一个字段的文本来验证输入的格式。

我一直在尝试的是，如果将“澳大利亚”国家/地区输入“国家/地区”文本框，则“电话”文本框仅限于格式（00）00000000以及是否为“除非”之外的任何其他国家/地区电话'文本框必须以国际号码方式格式化，包括例如以下的+和国家/地区代码+61等

到目前为止，我已经完成了这么多功能：

<script>
document.getElementById('txttelephone').onchange = function()
{
var num1 = document.getElementById('txttelephone').value,
    country = document.getElementById('txtcountry').value,
    regex;

if (country == "Australia" || country == "australia")
{
    regex = /\(\d{2}\)\d{8}/;
}
else
{
    regex = /\+\d{15}/;
}
if (!num1.match(regex))
{
    alert('That is not a correct telephone number');
}
}
</script>

这就是我将“电话”文本框的字符串长度限制为12个字符所做的功能，但我还没有验证，以确保区域代码包含在括号之间的形式（ 00）00000000并且如果该国家/地区不是澳大利亚（国际号码包括国家/地区代码），则还要验证是否包含+。

这是HTML我必须使用的功能：

<b>Country:</b> <input type="text" id="txtcountry" name="country">
<br>
<b>Telephone:</b> <input type="text" id="txttelephone" name="telephone">

非常感谢任何帮助！

Answer 1

您需要regular expression来测试电话号码是否符合您想要的格式。

这是一个澳大利亚数字/\(\d{2}\)\d{8}/。正则表达式以/开头和结尾，然后它会与左括号\(匹配，后跟两个数字\d{2}，右括号\)和8个数字\d{8}。

所以你的功能可以成为这个

//changed to onchange event of `txttelephone`
 document.getElementById('txttelephone').onchange = function(){  
     var num1 = document.getElementById('txttelephone').value,  //added .value here
        country = document.getElementById('txtcountry').value,
        regex;
    if(country == "Australia" || country == "australia"){
       regex = /\(\d{2}\)\d{8}/;
    } else {
       regex = /\+\d{15}/;        
    }

    if(!num1.match(regex)){   //If there was not a match for your number format
       alert("thats not a ruddy telephone number!");
    }
}

作为附注，我强烈建议你不要让用户“自由”输入他们的国家，因为任何错别字意味着你的逻辑将无法工作，即你需要用户进入澳大利亚或澳大利亚，没有别的办法，下拉列表是为这种情况发明的：）。

Answer 2

尝试这样的事情。它没有经过测试，因此正则表达式可能不完全正确，但它至少应该有所帮助：

document.getElementById('myform').onsubmit = function(event) {
    var country = document.getElementById('txtcountry').value;
    var regex = /^\+\d{1,2}\(\d{2,3}\)\d{7,8}$/;
    if (country.toLowerCase() == 'australia') {
         // make the international code optional
        regex = /^(\+\d{1,2})?\(\d{2,3}\)\d{7,8}$/;
    }

    var phone = document.getElementById('txttelephone').value;
    if (!phone.test(regex)) {
        event.preventDefault();
        alert('Bad phone number!');
        return false;
    }
};

这会在他们尝试提交表单时检查值。如果它们给出了错误的值，它将显示错误消息并阻止提交。

另外，正如@MarkWalters建议的那样，我会使用下拉列表而不是国家/地区名称的文本字段。打字错误不仅会破坏你的逻辑，而且如果用户输入错字并且你需要搜索国家“澳大利亚”的所有用户，你可能会错过输入错误的用户。

输入改变文本框格式

2 个答案: