[JS] 여러 input 에 한번에 붙여넣기

요즘엔 볼 수 없지만 예전에는 이런 시리얼번호를 입력하는 폼이 있었다. 

 

시리얼 번호를 입력할때 첫번째 input을 클릭한 뒤 복사한 텍스트를 붙여넣기를 하면

자동으로 모든 input 에 입력되는 기능!!

 

요즘엔 보안상의 문제인지, 시스템의 문제인지....

 

 

 

 

 

 

 

 

 

하나로 합쳐진 input창을 볼 수 있다.

 

 

하지만 나는 맨위에 input처럼 여러 input 에 한번에 붙여넣는 기능이 필요했다.

 

구글링 시도 중.......

 

모든 사이트를 찾아봐도 저렇게 구현되는 기능은 없었다🤯 

심지어 문화상품권을 입력하는 핀 input창도 요즘엔 input이 하나더라...

(불안해지기 시작)

 

 

열심히 찾는도중 onpaste 이벤트를 사용하면 붙여넣기 이벤트를 제어할 수 있다는 글을 발견했다.

 

 

결국 찾아냈는데, 

 

 

 

2004년에 네이버블로그로 포스팅한 글을 발견하였다.

https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=tear230&logNo=100004344284 

시리얼번호등 나누어진 텍스트박스폼에 한번에 붙여넣기

 

작성해 준 코드로 테스트를 해보았는데...

안된다. 시도를 해보니, 계속 함수가 없다는 에러메세지만 출력되고? 

블로그글에 짜놓은 함수가 잘못된것 같다는 생각이들었다.

작성한 코드를 하나씩 뜯어보았다...

onpaste를 input 에 넣지않고 element를 지정해서 넣어주었다.

성공은 아니지만 '에러메세지'가 뜨는 반가운 상황 ㅋㅋㅋ

 

 

 

 

이것저것 바꿔보며 테스트를 한 결과, 

 

 

 

드디어 성공! 

 

 

 

 

 

 

성공🎁

 

'문자'도 가능하고 '숫자'도 가능하다.

요즘엔 저런 폼을 잘 안쓰지만

혹시라도 나처럼 하루하고 반나절을 꼬박 고민하시는 분들이 없기를 바라며.....

글납깁니다.👍