html5 – Understanding

I am trying to get my head around and using the selected image in a website.

Let\’s say I have a simple website that lets the user select an image from their system using:

<input type=\"file\" id=\"userImage\">

Then in the JavaScript I can do this to get the file:

var userImage = document.getElementById(\'#userImage\').files[0]; 

Questions:

1) Can I now use userImage? Such as drawing it on a canvas, or do I need to uploaded it to the websites server first?

2) If I use the image, does the website have to upload it every-time I use it, or does it stay in memory?

3) How do I know when the image is ready to use? (for the same reasons all images should be preloaded at the start before drawn on canvas)

Thanks so much for your help

Follow-up

Thanks for your answers. So it looks like it is possible in html5 but not yet universally supported.

Rating: 2 out of 5 based on 3 ratings

Posts Related to html5 - Understanding <input type="file">

• Jul 31st, 2012 javascript - How to correctly alert my variable Tuesday AM 01:25:36


• Aug 03rd, 2012 javascript - Iterate through DIVS showing/hiding them in a carousel style Friday AM 01:03:06


• Aug 14th, 2012 Explanation needed understanding jQuery objects and offsets Tuesday AM 01:12:50


• Jul 09th, 2012 JSON results into a variable and store in hidden input field Monday PM 15:34:13


• Jul 25th, 2012 javascript - Method, Functions and Objects Wednesday AM 10:15:46


• Jul 25th, 2012 jquery - understanding a modular javascript pattern Wednesday AM 06:36:32


• Aug 05th, 2012 javascript - Why does 'this' get bound to the window inside the object's closure after backbone's model.fetch? Sunday PM 14:59:30


• Aug 12th, 2012 html5 - HTML 5 drawing line doesn't work Sunday AM 02:32:58


• Aug 03rd, 2012 jquery - Separate HTML/Javascript code into Friday AM 01:43:03


• Jul 19th, 2012 Implementing CSS variables in HTML page Thursday AM 08:45:51

The post html5 – Understanding <input type="file"> appeared first on Javascript ASK.

via Javascript ASK http://javascriptask.phpfogapp.com/html5-understanding-input-typefile.html