Image Preview By Javascript

<script src=”http://code.jquery.com/jquery-latest.min.js” type=”text/javascript”></script>
<script>
var blank=”http://upload.wikimedia.org/wikipedia/commons/c/c0/Blank.gif”;
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();

reader.onload = function (e) {
$(‘#img_prev’)
.attr(‘src’, e.target.result)
.height(200);
};

reader.readAsDataURL(input.files[0]);
}
else {
var img = input.value;
$(‘#img_prev’).attr(‘src’,img).height(200);
}
$(“#x”).show().css(“margin-right”,”10px”);
}
$(document).ready(function() {
$(“#x”).click(function() {
$(“#img_prev”).attr(“src”,blank);
$(“#x”).hide();
});
});
</script>
<input name=”pic” type=”file” id=”pic” class=”textarea” onchange=”readURL(this)”;>
<img src=”” id=”img_prev” />

Similar Posts

One Comment

  1. Java script is shortly called JS…JS is a Dynamic computer programming language. Using JS, We can develop more dynamic web pages. Your coding is for Preview the image which quite short and effective.

Leave a Reply

Your email address will not be published. Required fields are marked *