jQuery 上传多张图片时预览效果

HTML部分

<div class="one">
   <input type="file" id="uploadImg" onchange="xmTanUploadImg(this)">
   <div class="three"></div>
</div>

JS部分

<script>
    var images = [];//定义一个空的数组用来储存img路径
    function xmTanUploadImg(obj) {
        var file = obj.files[0];
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function (e) {    //成功读取文件
            images.push(e.target.result)//将所选择的图片路径添加到images数组中
            $(".three").empty();//循环之前移除该div下的子元素，避免重复出现
            for(var i=0;i<=images.length;i++){
                $('.three').append('<img src=" '+ images[i] +' " alt="">')//动态添加img标签
            }
            console.log(images)//打印数组内容
        };
    }
</script>

效果图