공지 게시판 자바스크립트

1. 파일 첨부 기능

// 파일 선택 시 표시해주는 펑션
var fs = document.querySelector('#fs');
var preview = document.querySelector('.preview');
fs.addEventListener('change', showTextFile);
function showTextFile() {
	while(preview.hasChildNodes()){
		preview.removeChild(preview.firstChild);
	}
	var sF = fs.files;
	var list = document.createElement('ul');
	preview.appendChild(list);
	for(var i=0; i< sF.length; i++) {
		let file = sF[i];
		var listItem = document.createElement('li');
		var summary = document.createElement('div');
		summary.textContent = '파일명 : '+ file.name + ' , 파일 크기 : ' + returnFileSize(file.size);
		listItem.appendChild(summary);
		list.appendChild(listItem);
	}
}
// 파일의 사이즈를 표시해주는 펑션
function returnFileSize(number) {
	if(number < 1024) {
		return number + 'bytes';
	} else if(number > 1024 && number < 1048576) {
		return (number/1024).toFixed(1) + 'KB';
	} else if(number > 1048576) {
		return (number/1048576).toFixed(1) + 'MB';
	}
}

// 글 수정 시 받아온 객체를 자바스크립트 객체로 변환
var ofL = new Array();
<c:forEach items="${ncr.fileList}" var ="file">
	var obj = new Object();
	obj.fileName = "${file.nf_ofname}";
	obj.fileSize = "${file.nf_fsize}";
	ofL.push(obj);
</c:forEach>

// 글 수정 페이지 로딩 시 원래 글의 파일정보를 표시
function showInitFile() {
	while(preview.hasChildNodes()){
		preview.removeChild(preview.firstChild);
	}
	var list = document.createElement('ul');
	preview.appendChild(list);
	for(var i=0; i< ofL.length; i++) {
		let fileName = ofL[i].fileName;
		let fileSize = ofL[i].fileSize;
		var listItem = document.createElement('li');
		var summary = document.createElement('div');
		summary.textContent = '파일명 : '+ fileName + ' , 파일 크기 : ' + returnFileSize(fileSize);
		listItem.appendChild(summary);
		list.appendChild(listItem);
	}
}