选择文件上传

开发工具与关键技术:Visual Studio 2015,ASP.NET,C#
作者:林江
撰写时间:2019年3月1

在实际的项目中,我们面对这各种各样的需求,其中选择文件上传则是必不可少的了。在这里举个简单的选择图片上传;
首先需要一个简单的按钮,用来调用该点击事件,代码如下:
在这里插入图片描述
然后就是获取“选择文件”的按钮,调用改变事件,接着应该使用正则表达式,已达到过滤文件格式的目的,代码如下:
在这里插入图片描述
如此一来,就达到了选择文件的目的,效果如下:

在这里插入图片描述

想要的效果已经达到,但可能会给使用者带来不便,这里只显示了该图片的名称,能不能更加直观的把效果表达出来呢?答案是肯定的!这时候我们可以在选择完文件之后给它一个预览效果;readAsDataURL()方法,它可以获取API异步读取的文件数据,另存为数据URL;将该URL绑定到img标签的src属性上,就可以实现图片的上传预览效果了;代码如下:
在这里插入图片描述
效果如下:

在这里插入图片描述

如果需要上传其他文件,则修改正则表达式已达到筛选自己所需的文件的目的即可;

猜你喜欢

转载自blog.csdn.net/weixin_44548195/article/details/88919278