[javascript] 휴대폰 숫자만 입력하기, 다음 input 박스로 커서 자동이동

function onlyNumber2(e) {

	var isWindowEvent = window.event ? true : false;
	if (isWindowEvent) {
	   if(((event.keyCode >= 48) && (event.keyCode <= 57))) {
		  event.returnValue = true;
	   } else {
		  event.returnValue = false;
	   }
	} else {

	   if(((e.which >= 48) && (e.which <= 57))) {

	   } else {
		 e.preventDefault();			
	   }
	}
}

function focusMove(obj,max,toObj) {
	value = obj.value;
	if (value.length >= max) {
		toObj.focus();
		return;
	}
}

<input type="text" name="hp1" value="" maxlength="3" style="width:36px;ime-mode:disabled;" onkeypress="onlyNumber2(event);" onkeyup="focusMove(this,3,document.f.hp2)"> 
- 
<input type="text" name="hp2" value="" maxlength="4" style="width:36px;ime-mode:disabled;" onkeypress="onlyNumber2(event);" onkeyup="focusMove(this,4,document.f.hp3)">
- 
<input type="text" name="hp3" value="" maxlength="4" style="width:36px;ime-mode:disabled;" onkeypress="onlyNumber2(event);">

 

onlyNumber2 함수는 숫자만 받게 하고, 

focusMove 함수는 해당 핸드폰 숫자입력 박스에 숫자를 그 해당 숫자갯수만큼만 입력하면 자동으로 다음 input 박스로 이동된다. 

 

실무에서 아주 유용함으로 꼭 익혀 두자~