图片上传

图片上传
图片上传：
第一步：去数据库用户表添加 picture 字段
第二步：更新数据库模型，在用户列表上自定义了一列就是头像列，用于上传图
片和查看，再到控制器查询头像的字段和数据。
第三步：自定义列头像用户 customUserPicture，头像这一列我们要做一个判断，
当它有图片我们设置成一个查看按钮，当它没有图片我们显示“未上传”，我们
只需要获取图片的名称就可以了
//1、自定义列用户头像
        function customUserPicture(data)
        {
            var picture = data.picture;//提取 picture //获取这个值
//通过 picture 名称去到具体的一个文件夹里找，那么文件夹在哪里呢？文件
夹统一跟我们那个 Excel 表格放在一起，专门建一个文件夹保存图片，
            if (picture != undefined && picture != null && picture !=
‘’)
            {
                return ‘查  
看’;
            }
            else {
                return “未上传”;
            }
        }
第四步：点击按钮显示图片（layui 对话框）
//2、查看按钮（显示图片）
        function openUserPicture(picture) {
            //图片路径
            var pictureUrl =
‘@Url.Content("~/Document/userPicture/")’ + picture;
            //图片元素
            var img = ‘’; 
            layer.open({//这是把头部去掉，关闭按钮去掉的对话框
                type: 1,// 页面层
                title: false,//关闭标题
                closeBtn: 0,//不显示关闭按钮
                shadeClose: true,//点击遮罩层关闭弹窗
                content: img //弹窗显示内容
            });
        }
第五步：
稍微修改操作，找到修改模态框，img 标签是打不开文件框的， 可以打开文件框
accept 属性只能配合 type="file"来使用
显示图片用的是 img 标签
第六步：
每次点击修改进来都要确保图片是空的，所以要一个清空操作，弹出修改的模态
窗体，通过 input 标签上传图片的
第七步：
$.post()和$.get()都不能使用，因为 $.post()和$.get()都会编译图片文件，
编译后就不能使用了，只能用$.ajax()异步提交和原始的 XMLhttprequest  这
两个
第八步：
在数据页面回填的地方我们要做一个判断，有一种情况是如果我们图片数据是
空的时候呢，因为他有记录上一次的内容所以我们要清空一下，或者说在回填之
前清空一下也可以
 
保存图片有两种思路：
第一种可以直接保存到数据库 SQL sever 但一般不建议用这种，因为这种图片
太占内存了读取数据就很慢
第二种就是把图片保存到文件夹里面，那我怎么知道哪个图片对应哪个用户呢？
所以我们就把名称保存到数据库里面，根据名称去匹配
图片保存到文件夹，图片名称保存到数据库 SQL sever，所以我们可以去数据库
得到图片名称，然后再建一个文件夹