Import

by jeum

HTML

<ul>
    <li>First click in this area to set the focus on document</li>
    <li>Press the Spacebar to open the filepicker</li>
</ul>
<p>Works (Window7) in Chrome, IE11, Opera, Safari</p>
<input type="file" id="fileInput"/></label>

CSS

body{font-size:1.5em;}
#fileInput{visibility:hidden}

JavaScript

document.addEventListener
(
    'keypress',
    function(e)
    {
        if ( e.which === 32 )
        {
            var el = document.getElementById('fileInput');
            //var el = document.getElementById('idlabel');
            //eventFire(el);
            //eventFire2(el);
            
            if (el.click) {
                el.click();
            }
            else {
                simulateClick(el);
            }
        }
    },
    false
);

// https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events#Triggering_built-in_events
function simulateClick(el) {
  var event = new MouseEvent('click', {
    'view': window,
    'bubbles': true,
    'cancelable': true
  }); 
  el.dispatchEvent(event);
}

// http://stackoverflow.com/questions/2705583/how-to-simulate-a-click-with-javascript?answertab=active#tab-top
function eventFire(el){
  if (el.fireEvent) {
    el.fireEvent('onclick');
  } else {
    var evObj = document.createEvent('Events');
    //var evObj = document.createEvent('MouseEvents'); // same
    evObj.initEvent("click", true, false);
    el.dispatchEvent(evObj);
  }
}

function eventFire2(el){
// Firefox
if (document.createEvent) {
    var event = document.createEvent("MouseEvents");
    event.initEvent("click", true, true);
    el.dispatchEvent(event);
}
// IE
else if (el.click) {
    el.click();
}
}