Welcome folks today in this blog post we will be displaying remote image
from url and download
it inside the browser as an attachment in javascript. All the full source code of the application is shown below.
Get Started
In order to get started you need to make an index.html
file and copy paste the following code
index.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<html> <body> <form> <input type="text" id="imagename" value="" /> <input type="button" id="btn" value="GO" /> </form> <script type="text/javascript"> document.getElementById('btn').onclick = function() { var val = document.getElementById('imagename').value, src = 'http://webpage.com/images/' + val +'.png', img = document.createElement('img'); img.src = src; document.body.appendChild(img); } </script> </body> </html> |
As you can see we have the simple input
field where we allow the user to enter the url of the image and then we have the button to show
the remote image
inside the browser