Muhammad Harits Syaifulloh

Tuesday, August 30, 2016

Preview Image Before Its Uploaded using jQuery

Hi guys, in this tutorial I'll show you about Preview Image Before Its Uploaded using jQuery. Okay so I think this is an important thing because we or users of our web have to make sure that the images will be uploaded are right.

So in this tutorial I'll use jQuery and Let's go!

Case :

I want to be able to preview a file (image) before it is uploaded. The preview action should be executed all in the browser. How can I do this?

Solution :

First, I have an index.html file, it's look like this code below:

Now I add this javascript code:

And finally it will look like this:


your image