Trigger a file open dialog and read local file in JavaScript

read-local-file.js

/*
* Trigger a file open dialog and read local file, then read and log the file contents
*/

var element = document.createElement('div');
element.innerHTML = '<input type="file">';
var fileInput = element.firstChild;

fileInput.addEventListener('change', function() {
    var file = fileInput.files[0];

    if (file.name.match(/\.(txt|json)$/)) {
        var reader = new FileReader();

        reader.onload = function() {
            console.log(reader.result);
        };

        reader.readAsText(file);    
    } else {
        alert("File not supported, .txt or .json files only");
    }
});

fileInput.click();

Is there any way to catch the event of cancelling open dialog?

Hello, on Chrome the "change" event is not triggered the first time, just the second and so...