JavaScript
-
[JavaScript] axios를 이용한 파일 업로드JavaScript 2023. 8. 22. 19:29
/* 파일 전송 */ function fileFormSubmit() { // 파일 데이터 const formData = new FormData(); formData.append("file", file.files[0]); // 폼 전송 axios({ method: 'post', url: '/admin/excel', headers: { 'Content-Type': 'multipart/form-data' }, data: formData, timeout : 3000, }).then(function (response) { alert("데이터 전송 완료"); }).catch(function (error) { alert(error); }).finally(function () { }); }
-
[JavaScript] 파일첨부 파일명, 확장자 추출JavaScript 2023. 8. 22. 19:26
HTML 엑셀업로드 JavaScript // 파일명 불러오기 const file = document.getElementById('file'); let path = file.value; let fileName = path.substring(path.lastIndexOf('\\')+1, path.length); // 확장자 추출 let ext; if(fileName.indexOf('.') >= 0) { ext = fileName.substring(fileName.lastIndexOf('.')+1, fileName.length); } else { ext = ''; } // 파일 검증 if (file == "") { alert("파일이 없습니다.") return false; } else if (ext.toL..
-
[JavaScript][링크스크랩] 스크롤 맨 아래로 내리기JavaScript 2021. 9. 15. 09:09
참고 https://ungdoli0916.tistory.com/454 (즐거웅코드) 자바스크립트 스크롤 맨 아래로 내리기 [즐거'웅'코드] 목차 JAVASCRIPT 예제 소스 구현 예시 JAVASCRIPT 1 2 3 document.body.scrollTop = document.body.scrollHeight; 예제 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22.. ungdoli0916.tistory.com
-
[JavaScript] 첨부파일 다중파일 multiple 업로드 2JavaScript 2021. 9. 2. 13:08
DataTransfer() 라는 함수를 쓰는 방법이다. 해당 예제는 계속 파일을 누적으로 추가를 할 수는 없고 파일 추가를 계속 하게 되면 기존 파일은 리셋되고 새로운 파일로 바뀌는 것이다. 코드는 어디서 건너건너 퍼온거고 내가 따로 덧붙여서 수정하진 않고 핵심 기능만 보여줌. See the Pen by green526 (@green526) on CodePen. 코드 더보기 html css .insert { padding: 20px 30px; display: block; width: 600px; margin: 5vh auto; height: 90vh; border: 1px solid #dbdbdb; -webkit-box-sizing: border-box; -moz-box-sizing: border-box..
-
[JavaScript] 첨부파일 다중파일 multiple 업로드JavaScript 2021. 9. 2. 11:20
Ver1. 파일 첨부 시 최대 개수가 넘으면 현재 선택된 파일은 전부 첨부를 안 하는 방식. See the Pen [T] 다중파일 업로드 v1 by green526 (@green526) on CodePen. Ver2. 파일 첨부 시 최대 개수를 넘으면 최대 개수 까지만 첨부하는 방식. See the Pen by green526 (@green526) on CodePen. 코드 더보기 html css .insert { padding: 20px 30px; display: block; width: 600px; margin: 5vh auto; height: 90vh; border: 1px solid #dbdbdb; -webkit-box-sizing: border-box; -moz-box-sizing: border..
-
[JavaScript] 파일 첨부 시 파일타입 체크하기JavaScript 2021. 9. 1. 08:43
첨부파일 첨부 시 파일 타입 체크 const fileTypes = [ 'text/plain', ]; if (!fileTypes.includes(file.type)) { alert("첨부가 불가능한 파일입니다."); } 참고 https://hianna.tistory.com/345 [Javascript] 로컬 텍스트 파일 읽기 (다중 파일 선택) HTML/Javascrip로 로컬 텍스트 파일을 읽어서 선택한 파일에 대한 정보 (파일명, 파일크기 등)을 보여주는 코드입니다. Ctrl / Shift 키를 사용하여 여러개의 파일을 선택할 수 있습니다. See the Pen read fil hianna.tistory.com https://developer.mozilla.org/en-US/docs/Web/HTTP/B..
-
[JavaScript] 문자열 삽입, 스트링, StringJavaScript 2021. 8. 30. 16:53
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String String - JavaScript | MDN String 전역 객체는 문자열(문자의 나열)의 생성자입니다. developer.mozilla.org 템플릿 리터럴 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Template_literals Template literals - JavaScript | MDN 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴입니다. 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있습니다. 이전 버전의 ES2015사양 명세에서는 "template s..