hmw1001
56 lines
2.6 KiB
JavaScript
56 lines
2.6 KiB
JavaScript
// jQuery가 로드된 후 이 스크립트가 실행되어야 합니다.
|
|
$(function() {
|
|
// Datepicker 초기화
|
|
$(".datepicker").datepicker({
|
|
dateFormat: "yy-mm-dd",
|
|
changeMonth: true,
|
|
changeYear: true,
|
|
dayNamesMin: ["일", "월", "화", "수", "목", "금", "토"],
|
|
monthNamesShort: ["1월", "2월", "3월", "4월", "5월", "6월", "7월", "8월", "9월", "10월", "11월", "12월"],
|
|
});
|
|
|
|
// ▼▼▼ [핵심 수정] 여러 파일 미리보기 기능 ▼▼▼
|
|
const fileWrappers = document.querySelectorAll('.file_preview_wrapper');
|
|
|
|
fileWrappers.forEach((wrapper, index) => {
|
|
const previewBox = wrapper.querySelector('.file_preview');
|
|
const fileInput = wrapper.querySelector('input[type="file"]');
|
|
const previewText = previewBox.querySelector('.preview_text');
|
|
const existingFileInfo = wrapper.querySelector('.preview_info');
|
|
|
|
if (!previewBox || !fileInput) return;
|
|
|
|
// 1. 미리보기 박스를 클릭하면 숨겨진 파일 입력 필드가 클릭되도록 함
|
|
// previewBox.addEventListener('click', () => {
|
|
// fileInput.click();
|
|
// });
|
|
|
|
// 2. 파일이 선택되었을 때의 동작
|
|
fileInput.addEventListener('change', (event) => {
|
|
const file = event.target.files[0];
|
|
if (file) {
|
|
// 기존 파일 정보가 있다면 숨김 (새 파일로 교체되므로)
|
|
if (existingFileInfo) {
|
|
existingFileInfo.style.display = 'none';
|
|
}
|
|
|
|
if (file.type.startsWith('video/')) {
|
|
// 동영상은 미리보기를 생성하지 않고 파일 이름만 표시
|
|
previewBox.style.backgroundImage = 'none';
|
|
previewText.textContent = `동영상: ${file.name}`;
|
|
previewText.style.display = 'block';
|
|
} else if (file.type.startsWith('image/')) {
|
|
// 이미지는 FileReader를 사용해 미리보기 생성
|
|
const reader = new FileReader();
|
|
reader.onload = function(e) {
|
|
console.log("sdfasdfasfd= > ",`url(${e.target.result})`)
|
|
previewBox.style.backgroundImage = `url(${e.target.result})`;
|
|
previewText.style.display = 'none'; // '클릭하여 파일 업로드' 텍스트 숨김
|
|
}
|
|
reader.readAsDataURL(file);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
// ▲▲▲ 여기까지 ▲▲▲
|
|
}); |