메뉴 건너뛰기

프로그램언어

조회 수 357 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

필자는 보통 로그인 창을 설계할때
 

아이디 : 로그인하기
비밀번호:


이런식으로 테이블 레이아웃을 설정했었다.

하지만 이런식으로 설계하고 아이디를 입력하고 [Tab] 버튼을 누르면 패스워드가 아닌 "로그인" 하기로 커서가 넘어간다.
그래서 이걸 잡아주려고 javascript로 focus 지정을 해주고 그랬었는데...

input태그의 속성중에 tabindex라는 것이 있더라.

<input type="text" name="a" tabindex="2">
<input type="text" name="b" tabindex="1">
<input type="text" name="c" tabindex="3">

b -> a -> c 순서로 커서가 이동된다.

이런식으로 써주면 현재 커서에서 [Tab]을 누를시에 자신의 tabindex 번호 다음 번호로 커서가 가게 된다.

별거 아닌 내용이지만,
여태껏 이것도 모르고 javascript로 focus 순서를 잡아준게 한심해서 글을 써본다 .ㅡ/.ㅡ;;


  1. No Image 27Jan
    by
    2023/01/27 Views 2199 

    HTML 특수문자 / 띄어쓰기,공백, 따옴표

  2. input 속성 readonly, disabled 차이점

  3. No Image 12Jan
    by
    2023/01/12 Views 249 

    Input 태그 한글, 영문모드 전환

  4. No Image 26Mar
    by
    2021/03/26 Views 301 

    MSword : 인쇄 미리보기-한페이지씩 보이기

  5. No Image 26Mar
    by
    2021/03/26 Views 201 

    map태그에서 window.open() 쓰기

  6. No Image 26Mar
    by 조쉬
    2021/03/26 Views 357 

    input태그 tab 순서 설정 : tabindex

  7. No Image 25Mar
    by
    2021/03/25 Views 130 

    인라인 자동완성 기능 막기

  8. No Image 25Mar
    by
    2021/03/25 Views 166 

    javascript로 alt 또는 title 달때 내용에 포함된 따옴표 치환하기

  9. No Image 09Mar
    by
    2021/03/09 Views 152 

    HTML - Form 태그, Input 태그 자동완성 해제하기

  10. CSS - p태그 등 너무 긴 문자열이 존재할 때, 넓이에 따른 자동 줄바꿈

  11. HTML - Table td안에 특수문자(")가 존재할 경우 넓이 초과 현상

  12. HTML, CSS - 헤더컬럼 고정형 table 구성하기

  13. 크롬 알림처럼 띄워보기

  14. No Image 29Apr
    by
    2019/04/29 Views 787 

    네이버 웹마스터도구 메타태그

  15. div iframe 퍼센트 높이조절 문제 해결(div, iframe height 100%)

  16. input 자동완성 끄기 HTML

  17. No Image 16Jan
    by
    2019/01/16 Views 2122 

    테이블 대신 필드셋(fieldset) 이용

  18. No Image 27Oct
    by
    2018/10/27 Views 1166 

    FCKeditor 2.6.x 버전 IE9에서의 Dialog 버그 수정

  19. No Image 24Aug
    by
    2018/08/24 Views 1723 

    form안의 button submit 동작 막기

  20. viewport meta 태그를 이용해 모바일 브라우저상에서 레이아웃 조종하는 법

Board Pagination Prev 1 2 Next
/ 2

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved