電話番号チェック

2010.10.29

電話番号の入力値をリアルタイムにチェックするjavascript

全角、半角とも入力可
ハイフンあり、括弧あり入力可
桁数計算(通常10桁、携帯、IPなどは11桁)
入力値が不完全な場合は入力欄横に警告を表示
入力値が正しければ、自動的に次のフィールドへフォーカス移動

第２引数に次のフィールドのIDを設定します。設定しない場合は、フォーカスが外れます。


function TelCheck(obj,NextId) {
var str = obj.value;
var substr=str.replace(/[\-−ー―?‐\(\)（）\s]/g,"");
var alertId= "alert_"+obj.id;
if(str ==""){
document.getElementById(alertId).innerHTML="";
}
else if( str.match( /[^0-9０-９\-−ー―?‐\(\)（）\s]+/ ) ) {
document.getElementById(alertId).innerHTML="数字のみで入力して下さい。";
}
else if( substr.match( /^[^0|０]/ ) ) {
document.getElementById(alertId).innerHTML="市外局番から入力して下さい。";
}
else if( substr.match( /^00|^００/ ) ) {
document.getElementById(alertId).innerHTML="番号を確認して下さい。";
}
else if(substr.length>11 ) {
document.getElementById(alertId).innerHTML="桁数がオーバーしました。";
}
else if( !substr.match( /^0.0|^０.０/ ) && substr.length>10 ) {
document.getElementById(alertId).innerHTML="桁数がオーバーしました。";
}
else if( substr.match( /^0.0|^０.０/ ) && substr.length<11 ) {
document.getElementById(alertId).innerHTML="入力が不完全です";
}
else if(substr.length<10 ) {
document.getElementById(alertId).innerHTML="入力が不完全です";
}
else{
document.getElementById(alertId).innerHTML="";
if(NextId== undefined){
obj.blur();
}
else{
document.getElementById(NextId).focus();
}
}
}
フォームhtml
<form name="form">
電話<input type="text" name="tel" id="tel" onkeyup="TelCheck(this,'fax');" /><span class="alert" id="alert_tel" style="color:red;font-weight:bold;"></span><br />
fax<input type="text" name="fax" id="fax" onkeyup="TelCheck(this);" /><span class="alert" id="alert_fax" style="color:red;font-weight:bold;"></span>
</form>

動作デモ