<input type="file" id="upload">
<div id="show" class="show"></div>
.show{
  width: 400px;
  height: 300px;
  background: #eee;
}
$("#upload").change(function(e){
  var fileData = e.target.files[0]
  //讀取檔案內容
  var reader = new FileReader();
  reader.readAsText(fileData,"UTF-8");
         reader.addEventListener("load",function(event){
   $("#show").text(event.target.result);
})
  
})

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js