밤톨코딩
[JavaScript] click 함수를 사용하여 파일 선택 창을 열어보자 본문
반응형
파일 선택 버튼을 클릭하지 않아도 파일 선택 창을 열 수 있도록 해야 했는데, 이것을 자바스크립트(Javascript)에서 사용자가 클릭하지 않아도 강제적으로 이벤트를 실행시키는 click 함수를 사용하여 해결하였다.
HTML 코드
input 태그의 type="file"과 button 태그를 하나씩 만들었다. button 태그에는 fnOpen이라는 함수가 클릭하면 실행할 수 있도록 한다.
<body>
<input type="file" id="file">
<button id="btnFile" onclick="fnOpen();">열기</button>
</body>
JavaScript 코드
getElementById 함수를 사용하여 file 노드를 가져온 후 click 함수를 사용하여 대신 파일 선택 창을 열 수 있도록 하였다.
<script>
// 함수 선언
function fnOpen() {
// file 가져오기
var file = document.getElementById('file');
// 파일 선택 실행
file.click();
}
</script>
이상, 오늘도 밤톨만큼 코딩했다.
반응형
'LANGUAGE > JavaScript' 카테고리의 다른 글
| [JavaScript] 수정한 JS 파일이 브라우저에서 적용이 안 될 때 | 쿠키 삭제 (0) | 2022.11.27 |
|---|---|
| [JavaScript] 나만의 하이픈 포함 전화번호 정규식 (0) | 2022.11.19 |
'LANGUAGE/JavaScript' Related Articles
more
