输入改变文本框格式

时间:2013-04-05 13:49:47

标签: javascript string function validation format

我是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">

非常感谢任何帮助!

2 个答案:

答案 0 :(得分: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!");
    }
}

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

答案 1 :(得分:0)

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

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建议的那样,我会使用下拉列表而不是国家/地区名称的文本字段。打字错误不仅会破坏你的逻辑,而且如果用户输入错字并且你需要搜索国家“澳大利亚”的所有用户,你可能会错过输入错误的用户。