上传图片预览

<div class="col-sm-3">
    <img id="targetImg" alt="修改图像" class="img-thumbnail" src="" />
</div>
<div id="prevDiv" class="col-sm-3">
    <img id="uploadImg" alt="上传的图像" class="img-thumbnail" src="" runat="server" />
</div>

<input id="imgUpload" type="file" class="" accept="image/*" onchange="imgPreview(this);" />

<script type="text/javascript">

    function imgPreview(file) {
        if (file.files && file.files[0]) {
            var reader = new FileReader();
            reader.onload = function (evt) {
                //prevDiv.innerHTML = '<img src="' + evt.target.result + '" />';
                $("#uploadImg").attr("src", evt.target.result);
            }
            reader.readAsDataURL(file.files[0]);
        }
        else {
            $("#prevDiv").innerHTML = '<div style="width:20px;height:35px" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';
        }
    }
</script>

　　效果：

详细参考：

http://wangyong31893189.iteye.com/blog/1695472