생활속 보물창고 : 일상 속 유용한 정보를 공유드립니다.

 

 

 

jQuery와 JavaScript를 사용하여 텍스트 파일을 입력 받으면 해당 파일의 내용을 `textarea`에 추가하는 로직은 다음과 같습니다:

 

1. 파일 입력 요소(<input type="file">)를 사용하여 사용자로부터 텍스트 파일을 받습니다.
2. JavaScript의 FileReader API를 사용하여 파일 내용을 읽습니다.
3. 읽은 텍스트를 `textarea`에 추가합니다.

 

 

HTML

 

<input type="file" id="fileInput">
<textarea id="myTextarea"></textarea>

 

 

jQuery & JavaScript

 

$(document).ready(function() {
$('#fileInput').on('change', function(event) {
var file = event.target.files[0];

if (file && file.type === "text/plain") {
var reader = new FileReader();

reader.onload = function(e) {
var content = e.target.result;

// 파일의 내용을 textarea에 추가합니다.
$('#myTextarea').val(function(index, currentContent) {
return currentContent + content;
});
};

reader.readAsText(file);
} else {
alert("텍스트 파일을 선택해주세요.");
}
});
});

이 코드는 사용자가 파일을 선택하면 FileReader 객체를 사용해 해당 파일을 읽고, 파일의 텍스트 내용을 `textarea`에 추가합니다. `file.type === "text/plain"`을 확인함으로써 사용자가 텍스트 파일을 선택했는지 검증합니다. `onload` 이벤트가 발생하면 (파일 읽기가 완료되면) 파일 내용을 `textarea`의 현재 내용에 추가합니다.

 

반응형

공유하기

facebook twitter kakaoTalk kakaostory naver band