HTML
<img src="images/avatar.jpg" style="width:50%;" id="image_upload_preview">
<input type="file" id="inputFile" name="profile_photo">
JS
//Live Profile Photo
function imageURL(input)
{
if (input.files && input.files[0])
{
var reader = new FileReader();
var sizeKB = input.files[0].size;
if (sizeKB < 1048576) {
//alert("file size is less than 1mb");
}
else
{
alert("file size maximum 1 MB ");
return false;
}
reader.onload = function (e) {
$('#image_upload_preview').attr('src', e.target.result);
$("#image_upload_preview").css("height", "200px");
}
reader.readAsDataURL(input.files[0]);
}
}
$("#inputFile").change(function () {
imageURL(this);
});
<img src="images/avatar.jpg" style="width:50%;" id="image_upload_preview">
<input type="file" id="inputFile" name="profile_photo">
JS
//Live Profile Photo
function imageURL(input)
{
if (input.files && input.files[0])
{
var reader = new FileReader();
var sizeKB = input.files[0].size;
if (sizeKB < 1048576) {
//alert("file size is less than 1mb");
}
else
{
alert("file size maximum 1 MB ");
return false;
}
reader.onload = function (e) {
$('#image_upload_preview').attr('src', e.target.result);
$("#image_upload_preview").css("height", "200px");
}
reader.readAsDataURL(input.files[0]);
}
}
$("#inputFile").change(function () {
imageURL(this);
});
file upload and preview in jquery file size get and alert
No comments:
Post a Comment