index.html

<!DOCTYPE html>  
<html>  
<head>  
<title>立即显示上传的图片</title>  
<meta charset="utf-8">  
  
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>  
<script type="text/javascript">  
$(function() {  
    /*原理是把本地图片路径："D(盘符):/image/..."转为"http://..."格式路径来进行显示图片*/  
    $("#fileupload").change(function() {  
        var $file = $(this);  
        console.log($(this));
        for (var i = 0; i < $file[0].files.length; i++) {
             
            var objUrl = $file[0].files[i];
            //获得一个http格式的url路径:mozilla(firefox)||webkit or chrome  
            var windowURL = window.URL || window.webkitURL;  
            //createObjectURL创建一个指向该参数对象(图片)的URL  
            var dataURL = windowURL.createObjectURL(objUrl);
            // var para=document.createElement("img");
            // para.setAttribute('class','imageview')
            // $(".imageview").attr("src",dataURL);
            // document.getElementById("fileupload").appendChild(para);  
            console.log(dataURL); 
            document.getElementById("fileupload").insertAdjacentHTML('afterEnd', '<img class="imageview" src='+dataURL+'> ');
        };
    });  
});  
</script>  
</head>  
<body>  
    <input id="fileupload" type="file" multiple="multiple" />  
    <!-- <img class="imageview" >   -->
</body>  
</html>  