javascript - HTML not rendering the img after I change src on the run time -
i have following code -
<html> <head> <script> function myfunction() { var x = document.getelementbyid("myfile"); alert(x.value); document.getelementbyid("picture").src=x.value; } </script> </head> <body> <input type="file" id="myfile"><br> <button onclick="myfunction()">render this</button> <img id="picture" src="c:\users\shin\desktop\410.svg"> </body> </html> initailly showing image, after select file , click button, shows me path in alert box but, doesnt render new pic , showing red cross @ place see in image when src incorrect. used chrome browser.
try this...
<html> <head> <script> function myfunction() { var input = document.getelementbyid("myfile"); var freader = new filereader(); freader.readasdataurl(input.files[0]); freader.onloadend = function(event){ var img = document.getelementbyid("picture"); img.src = event.target.result; } } </script> </head> <body> <input type="file" id="myfile"><br> <button onclick="myfunction()">render this</button> <img id="picture" src="c:\users\rajpc\pictures\1390.jpg"> </body> </html> this work.... change img src desired.. hope should you....
Comments
Post a Comment