Cacher is the code snippet organizer for pro developers

<input type="file" id="file" style="display:none">
<li><a href="javascript:triggerLoad()">Load from file</a></li>

$("#file").on("change",loadFile);

function triggerLoad(){
    $("#file").val("");
    $("#file").trigger('click');
}

function readSingleFile(file) {
    if (!file) {
        return;
    }
    var reader = new FileReader();
    reader.onload = function (e) {
        var contents = e.target.result;
        processContents(contents);
    };
    reader.readAsText(file);
}

function loadFile() {
    let file=$("#file")['0'].files[0];
    readSingleFile(file);
    return false;
}

<input type="file" id="file">

function displayContents(contents) {
    console.log(contents);
}

function readSingleFile(e) {
    var file = e.target.files[0]; //file variable is of type Blob
    if (!file) {
        return;
    }
    var reader = new FileReader();
    reader.onload = function (e) {
        var contents = e.target.result;
        displayContents(contents);
    };
    reader.readAsText(file);
}

$("#file").change(readSingleFile);