키보드를 이용한 포커스 이동
페이지 정보
작성자 서방님 댓글 0건 조회 176회 작성일 07-07-09 09:34본문
<html>
<head>
<title>키보드를 이용한 포커스 이동...!</title>
<script language="javascript">
var InputTotal = 11; // 총input수...^^
function func_onLoad(){
form.elements[1].focus();
}
function func_inputKey(obj){
var ie = (document.all) ? 1:0
if (ie) { var EKC = event.keyCode;}
var Idx = obj.tabIndex; //해당 tabIndex 가져오기..
switch (EKC) {
case (13) : if(Idx==InputTotal){ //enter
alert("폼 전송");
}else{
event.keyCode = "9"; //tab키의 keyCode값으로 변환
}
break;
case(33) : form.elements[1].focus(); //pageUp
break;
case(34) : form.elements[InputTotal].focus(); //pageDown
break;
case(38) : if(Idx==1){ // Up 화살표
return false;
}else{
form.elements[Idx-1].focus();
}
break;
case (40) : if(Idx==InputTotal){ //down 화살표...
return false;
}else{
event.keyCode = "9"; //tab키의 keyCode값으로 변환
}
break;
default : return false;
break;
}
}
</script>
</head>
<body onload="func_onLoad();">
<form name="form" method="post" action="" target="">
<input type="hidden" name="blank">
<input tabIndex="1" type="text" style="" Name="a" onkeydown="func_inputKey(this);" value=" 1번째 "><br>
<input tabIndex="2" type="text" style="" Name="b" onkeydown="func_inputKey(this);" value=" 2번째 "><br>
<input tabIndex="3" type="text" style="" Name="c" onkeydown="func_inputKey(this);" value=" 3번째 "><br>
<input type="text" style="background:#d6d3ce" Name="d" onfocus="form.elements[3].focus();" readonly value=" 4번째 읽기전용"><br>
<input type="text" style="background:#d6d3ce" Name="e" onfocus="form.elements[3].focus();" readonly value=" 5번째 읽기전용"><br>
<input tabIndex="6" type="text" style="" Name="f" onkeydown="func_inputKey(this);" value=" 6번째 "><br>
<input tabIndex="7" type="text" style="" Name="g" onkeydown="func_inputKey(this);" value=" 7번째 "><br>
<input tabIndex="8" type="text" style="" Name="h" onkeydown="func_inputKey(this);" value=" 8번째 "><br>
<input tabIndex="9" type="text" style="" Name="i" onkeydown="func_inputKey(this);" value=" 9번째 "><br>
<input tabIndex="10" type="text" style="" Name="j" onkeydown="func_inputKey(this);" value="10번째 "><br>
<input tabIndex="11" type="text" style="" Name="k" onkeydown="func_inputKey(this);" value="11번째 "><br>
<br>
<br>
enter,↑,↓,PageUp,PageDown
</form>
</body>
</html>
댓글목록
등록된 댓글이 없습니다.