이벤트 트리거

[Javascript] 이벤트 트리거를 사용하여 input 속성을 커스터마이징 해보자!

이번 포스팅은 이벤트 트리거를 사용하여 input 속성을 커스터마이징 해보겠습니다. html에서 input 속성을 그대로 사용하면 아래와 같습니다. css로 꾸미려고 하면 다음과 같이 됩니다. 파일 선택만 남기고 깔끔하게 디자인을 할 수 있는 방법이 없을까요? 자바스크립트에서 제공하는 이벤트 트리거라는 기능을 사용하면 깔끔하게 디자인이 가능합니다. 이벤트 트리거 트리거는 '방아쇠'를 의미합니다. 방아쇠를 당기면 총알이 나가는 것처럼 어떠한 행위(클릭 등)를 했을 때 파일을 선택할 수 있도록 할 수 있습니다. span 태그를 하나 생성해서 span 태그를 눌렀을 때 위의 input을 실행시켜보겠습니다. 우선 하나의 div태그에 input, span을 같이 넣어두겠습니다. 파일선택 이 상태라면 파일 선택이 ..