In this program, you will learn how to upload an image in your HTML form and you can see the image that you upload.
UploadImage.html
<html>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
function imageIsLoaded(e) {
<input type="reset" value="Cancel">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
function imageIsLoaded(e) {
<input type="reset" value="Cancel">
<head>
<title>upload</title>
</head>
<body bgcolor="yellow">
<center><h1>Submit Your Query</h1>
<form>
Name:<input type="text" name="usrname">
<br>
<br>
<textarea rows="4" cols="50">
Enter text here...</textarea><br><br>
<input type='file' />
<img id="myImg" src="#" alt="
Your Image" width="200" height="150" />
$(":file").change(function () {
if (this.files && this.files[0]) {
var reader = new FileReader();
reader.onload = imageIsLoaded;
reader.readAsDataURL(this.files[0]);
}
});
});
$('#myImg').attr('src', e.target.result);
};
</script>
<br>
<br>
<input type="submit" value="Submit">
</form>
</table>
</body>
</center>
</html>
0 Comments