input type="file" using link in Jquery

Question

Is it possible to emulate <input type="file"> and get a file browser using a link and jQuery?

I've tried to find a tutorial to do this, but a search on google doesn't show me any answers. Any help will be most appreciated.

What is your end goal here? What are you trying to accomplish ? — BjarkeCK, Jun 29 '12 at 14:56

score 2 · Answer 1 · answered Jun 29 '12 at 14:53

2

Short answer: no.

file inputs let to browse your disk, etc to select a file. This can't be emulated with any other standard HTML/JS technique.

answered Jun 29 '12 at 14:53

WhyNotHugo

score 0 · Answer 2 · answered Jun 29 '12 at 14:57

0

I've achieved similar in the past but its a bit of a hack:

Put a normal fileupload on the page.
Make it completely transparent(using opacity - don't change it's visibility to hidden)
Position your link under the file upload browse button.

When the user thinks they're clicking on the link, they will actually click the browse button.

Its horrible, but I don't know of another way.

answered Jun 29 '12 at 14:57

Jon Egerton

Yep, that's what I do. If you ever want to style the input file element without having to use Flash instead, this is the way! – Ian Jun 29 '12 at 15:03
@BjarkeCK: Yep - that's the idea. Its ages since I did it though so mine wasn't as nice as that - mine was pre jQuery for a start. – Jon Egerton Jun 29 '12 at 15:08
Note that this will create issues while using a website with a keyboard, and a few accesibility issues as well. – WhyNotHugo Jun 29 '12 at 19:30
@Hugo: Valid point - its a consideration to be borne in mind. – Jon Egerton Jun 29 '12 at 19:38

2 Answers2