input上传图片并预览

$('#upload').on('change', function (e, tag) {
        var fileList = this.files;
        var reader = new FileReader();
        //获取第一张图片，读取文件转base64
        reader.readAsDataURL(fileList [0]);
        reader.onload = function () {
            //用户上传的图片
            $("预览图片的元素").attr('src',this.result) 
        };
})

以上是将图片转为base64编码形式进行预览，并未将图片上传至服务器；
若需要将图片传至后台，也可以将file文件转为formData形式后，通过ajax将文件传输到服务器上：

$('#upload').on('change', function (e, tag) {
                    var fileList = this.files;
                    let formData = new FormData();  // 创建form对象
                    formData.append('file', fileList[0]);  // 通过append向form对象添加第一张图片数据
                    $.ajax({
                        url: "...", //请求的接口地址
                        type: 'POST',
                        cache: false, //上传文件不需要缓存
                        data: formData,
                        processData: false, // 不要去处理发送的数据
                        contentType: false, // 不要去设置Content-Type请求头
                        async: false,
                        success: function(data){
                            //换取到图片的服务器地址
                            $("预览图片的元素").attr('src',data.data.src);
                        },
                        error: function(err){
                            console.log(err)
                        }
                    })
})