파일 내용 확인 관련 교육n정보/HTML 관련 정보2015. 7. 7. 11:34
<!DOCTYPE html>
<html>
<head>
<title> 13주차 과제 </title>
<meta charset="utf-8"/>
<script type="text/javascript">
function fileinfo(){
var file = document.getElementById("file").files[0];
document.getElementById("table").innerHTML += "<tr><td>파일 이름</td><td>"+file.name+"</td></tr>";
document.getElementById("table").innerHTML += "<tr><td>파일 크기</td><td>"+file.size+"</td></tr>";
document.getElementById("table").innerHTML += "<tr><td>파일 타입</td><td>"+file.type+"</td></tr>";
document.getElementById("table").innerHTML += "<tr><td>파일 수정 날짜</td><td>"+file.lastModifiedDate+"</td></tr>";
var file = document.getElementById("file").files[0];
var reader = new FileReader();
reader.readAsText(file, "utf-8");
reader.onload=function(){
var view=document.getElementById("content");
view.textContent = reader.result;
};
reader.onerror = function(event){
switch(event.target.error.code){
case error.NOT_FOUND_ERR:
alert("읽을 파일을 찾지 못하였습니다..");break;
case error.SECURITY_ERR:
alert("보안상 안전하지 않습니다..");break;
case error.ABORT_ERR:
alert("읽기가 중지되었습니다."); break;
case error.NOT_READABLE_ERR:
alert("읽기 권한이 없습니다."); break;
case error.ENCODING_ERR:
alert("파일 용량이 상한을 초과하였습니다."); break;
}
};
}
</script>
</head>
<body>
<input id="file" type="file">
<input type="button" onclick="fileinfo()" value="파일 내용 확인"><br><br>
<table id="table"></table>
<textarea id="content" readonly style="width:500px; height:400px;"></textarea>
</body>
'교육n정보 > HTML 관련 정보' 카테고리의 다른 글
| 동영상 재생 및 크기 조절 (0) | 2015.07.03 |
|---|---|
| [HTML]HTML 특징 (0) | 2015.06.02 |
| [HTML]HTML 이란 (0) | 2015.06.01 |
