<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<body>
<input type="file" onchange="previewFile()">
<br>
<img src="" height="200" alt="Image preview...">
</body>
<script type="text/javascript">
function previewFile() {
var preview = document.querySelector(‘img‘);
var file = document.querySelector(‘input[type=file]‘).files[0];
var reader = new FileReader();
reader.onloadend = function() {
preview.src = reader.result;
}
if (file) {
reader.readAsDataURL(file);
} else {
preview.src = "";
}
}
</script>
</html>
原文：http://www.cnblogs.com/yanwen2015/p/4863186.html