jquery - file input javascript click generated not from a real mouse click chrome

Question

i'm having trouble in chrome opening the popup for the file upload of a file input type.

As you can see here: http://jsfiddle.net/cavax/K99gg/3/, clicking on an elements can trigger a click on the file input, but for example hovering a element wont trigger a click on the input.

$('#test').on('click', function(){
   $('#upload').trigger('click');
});
$('#test').on('mouseenter', function(){
   $('#upload').trigger('click');
});

In the real life i'm having this trouble because in a web app i'm loading throw ajax a content witch has inside an input file. At the end of the load the popup file must open, but there is no way to get this works on Chrome (workign on FF).

The problem i guess is that the action is not generated by a mouse click (hover, timeout etc) so chrome wont trigger the fileupload.

I've also tryed this: http://jsfiddle.net/cavax/K99gg/7/, so click on the element, wait then trigger the click but nothing, because there is the "settimeout" in the middle of the click and the trigger :(

$('#test').on('click', function(){
  setTimeout(function(){
    $('#upload').trigger('click');
  }, 3000);
});

if you remove the delay: http://jsfiddle.net/cavax/K99gg/8/ it works Any idea to get this work?

Answer 1

If I remember correctly, mouseenter and mouseleave are specific to IE, not standard events. Maybe they were extended, but don't think they became a standard. So the event itself may generate you some problems.

To resolve this you can use a lib (like jQuery for example), that treats the browser differences (or you can check the code there and take what you need).

Second way... try mouseover... it worked better (again... didn't work with them for a while so things may have happened, but this is how I remember them to be).