폼의 탭키 순서를 지정하기

사용자가 각각의 폼 요소를 입력할 때 그 이동을 마우스로 하는 사람도 있지만 키보드를 즐겨 사용하는 사람들은 "탭(Tab)"키로 이동을 많이 한다. 만일 각 폼 요소의 탭 순서를 지정해 주고 싶다면 HTML 4 이상에 도입된 TABINDEX 속성을 이용하면 된다.

아래 첫 번째 입력 상자에 마우스로 포커스 시킨 후 "탭" 키를 눌러보기 바란다. 왼쪽 위, 아래, 오른쪽 위, 아래 순서로 이동이 되는 것을 확인할 수 있을 것이다.

<form name="myForm"><input tabindex="1" name="field1" /><input tabindex="3" name="field2" /><br /><input tabindex="2" name="field3" /><input tabindex="4" name="field4" /></form>

위 예제에 대한 HTML 코드는 다음과 같다.

<form name="myForm"><br /><input tabindex="1" name="field1" type="text" /><br /><input tabindex="3" name="field2" type="text" /><br /><br /><br /><input tabindex="2" name="field3" type="text" /><br /><input tabindex="4" name="field4" type="text" /><br /></form>

위에서 사용한 TABINDEX 속성은 인터넷 익스플로러 4 이상, 넷스케이프 6 이상에서 사용할 수 있다. 혹 넷스케이프 4 에서도 이 기능을 사용하고 싶은 경우는 별도의 방법을 이용해야 한다.

http://korea.internet.com/channel/content.asp?cid=187&nid=26554