Making an image an upload function without making it an input

Question

I'm in a sticky situation. I'm trying to make an image an upload button, but I cannot change that image at all... however, when you click the image, I have it calling a JS function I can put anything into.

How can I launch an browser upload though this function alone? Normally I would just make the image an input, but like I said, in this case I cannot do that.

Does anyone have an example they could share?

Here's my function (which is called onclick of the image):

 function fnImport(elem){
    var $input;

    $input = $input || $("<input type='file'>");
    $('#Import').append($input);
    $input.click();
    $input.hide();



    }

However, when I run it, on the first click it adds the button, then on second it acts as an upload (and doesn't hide in either).

In addition, I'm getting a strange as well in my console?

you can't just launch an upload just by calling something. That is a matter of security. If it would be possible a website could automatically upload data from the user machine without the knowledge of the user — Sven Bieder
– Sven Bieder, Commented Oct 12, 2012 at 18:08
By launching an upload, I may have not been clear. I mean, I just want the computer file browser to appear, as if they clicked on "<input type="file">, not an automatic upload of something on their computer. — streetlight
– streetlight, Commented Oct 12, 2012 at 18:11

Casey Foster · Accepted Answer · 2012-10-12 18:08:30Z

1

Something like this might spark some ideas for you: http://jsfiddle.net/NKekN/2/

answered Oct 12, 2012 at 18:08

Casey Foster

6,0402 gold badges29 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

streetlight Over a year ago

This is amazing! Exactly on the lines I was thinking. However, I'm having trouble placing it inside my pre-existing click function. I've updated my question with some code (and added a hide to the input field you added!) -- could you help me sort this out by chance?

streetlight Over a year ago

Works perfect -- was having trouble fitting into my code for a second. Thank you for your help!

Collectives™ on Stack Overflow

Making an image an upload function without making it an input

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related