Question

This topic has been covered on this forums, but I haven’t found a working IE solution yet (tested 7, 8 & 9). Works fine in other browsers. I hope someone has a solution for it.
Thanks in advance!

What’s this about:

I want to get rid of the standard file input element so I added an image.
Upon click it shows the browse window. When a file is selected the form is submitted.
Due to browser security I temporarily show the file input element, focus and the hide it.

The problem:

IE shows “Access is denied.” jquery.1.7.2.js line 3241, character 6.
Without the show/hide trick, the problem remains.
When I click on the browse button and choose a file, the form does get submitted.
The problem seems to be that the file browsing action is triggered by another element:

Full code:

    $('#fakeupload').click(function(){
        $('#form').show();
        $('#realupload').focus().trigger('click');
        $('#form').hide();          
    });

    $('#realupload').change(function(){
        $('#form').show();
        $('#form').submit();
        $('#form').hide();          
    });

Answer 1

This remains an issue that can’t be solved. In order for it to work, the browse button must be clicked by the user. The trick here is modifying the browse button so it will fit the image.