<input type="file" id="myfile"><br/>
<textarea id="mycontents" cols="50" rows="10"></textarea>

document.addEventListener("DOMContentLoaded", init, false);
function init() {
  document.querySelector('#myfile').addEventListener('change', handleFileSelect, false);
}

function handleFileSelect(e) {
  console.log('called handleFileSelect');
  let files = e.target.files;

  let reader = new FileReader();
  reader.onload = function (e) {
    console.log(e.target.result);
    document.querySelector('#mycontents').value = e.target.result;
  }
  reader.readAsText(files[0]); 
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.