본문 바로가기

너와 나의 프로그래밍

너와 나의 프로그래밍

  • 분류 전체보기 (112)
    • Back-End (13)
      • Java Example (5)
      • Spring Framework (8)
    • Front-End (68)
      • TypeScript (6)
      • JavaScript (14)
      • Next.js & React.js (30)
      • Vue.js (8)
      • HTML5 & CSS3 (4)
      • JQuery (6)
    • Etc. (31)
      • Development Etc. (17)
      • Yoon's Life (14)
Guestbook
Today
Total
관리 메뉴
  • 글쓰기
  • 방명록
  • RSS
  • 관리

목록input move (1)

너와 나의 프로그래밍

JavaScript - Input 커서 이동 Tab, Backspace Focus

앱에서 회원가입을 할 때나 카드번호, 비밀번호, 생년월일 입력을 할 때 자주 사용되는 Input Element를 입력 후 자동으로 다음 Input으로 이동하는 Action을 많이 사용한다. 특히 모바일 환경에서 자주 볼 수 있는데, 비밀번호를 한 자리씩 입력 후 다음 자리를 입력하는 식, 또는 Backspace는 눌러 전 단계의 입력 Input으로 넘어가야되는 일이 발생할 수 도 있다. 하나의 Input을 사용했을 때는 커서 이동없이 바로바로 처리하면 되지만 부득이하게 Input을 여러 개 사용할 때의 이동 스크립트를 공유하려고 한다. 먼저 Input에 name Attribute를 추가해 주고 onkeydown 이벤트에 function에 event 매개변수를 추가해 Binding 해준다. 특히 maxle..

Front-End/JavaScript 2021. 11. 11. 11:22
이전 Prev 1 Next 다음

Blog is powered by kakao / Designed by Tistory

티스토리툴바