修改上传图片技术分享

开发工具与关键技术：VS，MVC
作者：陈梅
撰写时间：2019年6月23日
图片代码来源于老师教程
在做一些项目的时候，我们总会不时的用到一些图片，有些图片直接引用就可以了，而有些图片需要转换二进制才能显示。这种二进制的图片，大多数都用在用户登录账号，修改账号时，会有头像，而这个头像的图片就可以随意更换，上传。所以这次我分享的是已经上传了的图片，如何修改。首先我们来看一下控制器代码部分。、

已经上传了的图片，再进行更换图片。而它的控制器的代码非常的少，也很简单。先获取学生表的学生ID，获取了学生ID之后，在获取学生图片的字段。然后byte[]来保存修改的图片，所以需要赋值。最后返回图片的信息。注意数据库的图片名，跟上传的图片名是不一致的。所以修改的图片名，也跟数据库的图片名不一致。接着我们来看一下视图代码。
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲UsImgStudentPic…("#UsImgStudentPicture").attr(“src”,"/ExaminationManagement/SetExaminee/GetStudentImage?studentID=" + studentID)然后再回填图片的信息。获取ID，然后再获取图片的路径，和获取的图片所对应的ID。这句代码也是在打开修改模态框里面的。

打开模态框的代码写完，就到保存图片的代码了。保存修改的图片与上传图片保存一致。首先匹配图片的正则表达式。图片也属于文件的一类，所以正则表达式需要过滤。然后读取文件的onload时件。再对图片进行绑定。KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲IsImgStudentPic…("#UsImgStudentPicture")
attr(“src”, evt.target.result);而这句代码就是绑定修改了的图片。代码一致，就是ID不一样。然后再将选中的图片显示到img元素去，选取想选择的图片，然后把图片加载到image标签中去。选择好图片后，保存，弹出提示。function showImageFile(imageFileId) { $("#" + imageFileId).click();}这段代码是打开图片选择的文件，进行图片的选择。最后我们来看一下效果吧！


第一张是原有的图片，然后双击选择图片，就会把原来的图片给替换掉，然后点击保存按钮。就会弹出一个修改成功的提示框，这样上传图片的修改就这样完成了。代码也很简单，多尝试就可以了。