Просмотр изображений перед загрузкой на сайт

Это можно сделать, используя следующую функцию:

[code lang=»javascript»]
function readURL(input, img_container) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) { img_container.attr(‘src’, e.target.result); };
reader.readAsDataURL(input.files[0]);
}
}
[/code]

И использовать, например, так:

[code lang=»javascript»]
$(‘#myFileField’).change(function(e) {
readURL(e.target, $(‘#myImgPreview’));
});
[/code]

При верстке:

[code lang=»html»]
<div><input type="file" id="myFileField" /></div>
<div><img id="myImgPreview" /></div>
[/code]

Источник: http://stackoverflow.com/questions/4459379/preview-an-image-before-it-is-uploaded