asp.net html控件上传图片,asp.net fileupload控件上传图片并预览图片
本文为大家分享了fileupload控件实现上传图片后并进行预览图片的功能,并对web.config进行了配置,先看一下最终效果:
页面代码:
后台代码:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
namespace Web.File
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
#region 文件上传
///
/// 文件上传
///
protected void Button1_Click(object sender, EventArgs e)
{
if (FileUpload1.FileName == "")
{
this.Label1.Text = "上传文件不能为空";
return;
}
bool fileIsValid = false;
//如果确认了上传文件,则判断文件类型是否符合要求
if (this.FileUpload1.HasFile)
{
//获取上传文件的后缀
String fileExtension = System.IO.Path.GetExtension(this.FileUpload1.FileName).ToLower();
String[] restrictExtension = { ".gif", ".jpg", ".bmp", ".png" };
//判断文件类型是否符合要求
for (int i = 0; i < restrictExtension.Length; i++)
{
if (fileExtension == restrictExtension[i])
{
fileIsValid = true;
}
//如果文件类型符合要求,调用SaveAs方法实现上传,并显示相关信息
if (fileIsValid == true)
{
//上传文件是否大于10M
if (FileUpload1.PostedFile.ContentLength > (10 * 1024 * 1024))
{
this.Label1.Text = "上传文件过大";
return;
}
try
{
this.Image1.ImageUrl = "~/File/" + FileUpload1.FileName;
this.FileUpload1.SaveAs(Server.MapPath("~/File/") + FileUpload1.FileName);
this.Label1.Text = "文件上传成功!";
}
catch
{
this.Label1.Text = "文件上传失败!";
}
finally
{
}
}
else
{
this.Label1.Text = "只能够上传后缀为.gif,.jpg,.bmp,.png的文件";
}
}
}
}
#endregion
}
}
Web.config 配置:
为大家附3个精彩的专题:
亲,你可以在自己的项目中实现fileupload控件上传图片并进行预览图片的功能,这样网站更具有实用性,基本步骤就是这些,可能还有小编遗漏的地方,希望大家谅解。
asp.net html控件上传图片,asp.net fileupload控件上传图片并预览图片相关推荐
- [ASP.NET2.0] asp.net在ie7中使用FileUpload上传前预览图片 [ZT]
asp.net在ie7中使用FileUpload上传前预览图片 因为安全性问题,IE7禁用了image控件引用本地图片,为了这个问题郁闷了好几天,终于找到了解决方案,好东西要与大家分享,代码如下: 此 ...
- oracle如何上传图片,js实现上传图片之上传前预览图片
上传图片对图片进行一下预览,可以了解图片上传后大概会是什么样子,此功能用js实现,然后在fileupload控件的change事件中调用,这样当用fileupload选择完图片以后,图片就会自动显示出 ...
- ant design 预览图片_AntD框架的upload组件上传图片时遇到的一些坑
前言 本次做后台管理系统,采用的是 AntD 框架.涉及到图片的上传,用的是AntD的 upload 组件. 前端做文件上传这个功能,是很有技术难度的.既然框架给我们提供好了,那就直接用呗.结果用的时 ...
- 微信小程序上传图片、长按删除及预览图片
也是电商里做的上传评论图片之类的,如果用根据我文章中需要改的改一下就可以用了 首先是wxml <view class="conts"><view class=&q ...
- uniapp 上传图片 + 预览图片 + 删除图片
图片是用的阿里巴巴矢量图. <template> // html部分<view class="goods-box"><view class=" ...
- JS实现上传图片的三种方法并实现预览图片功能
在常见的用户注册页面,需要用户在本地选择一张图片作为头像,并同时预览. 常见的思路有两种:一是将图片上传至服务器的临时文件夹中,并返回该图片的url,然后渲染在html页面: 另一种思路是,直接在本地 ...
- 微信小程序实现发布新闻(上传图片、拷贝图片到服务器上面、预览图片)
我的qq 2038373094 我做的是微信小程序.网站.手机app,后端java+前端vue.bootstrap框架.原生的html+css+js都会 做过律师在线咨询系统.共享农场手机app.在线 ...
- uniapp点击上传图片,预览图片,删除图片
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言 一.uniapp点击上传图片 二.使用步骤 1.html部分 2.js部分 3.css部分 前言 提示:这里可以添加本 ...
- uniapp中上传图片(拍摄)和预览图片(图例和示例代码)
uniapp中上传图片和预览图片 图例: 示例代码: 内容 uni.chooseImage上传图片 uni.previewImage预览图片 复习下uniapp的上传图片和预览图片 需求:可以拍摄和上 ...
最新文章
- 1.2.5 计算机系统的多级层次结构(硬联逻辑级、微程序级、传统机器级、操作系统级、汇编语言级、高级语言级、应用语言级)
- 分享HTML 5的参考手册,演讲稿,电子书和教程
- 一道十分有趣的概率题!3局2胜和5局3胜哪个胜算更大?你怎么思考
- python写cadance skill_《Cadence 16.6电路设计与仿真从入门到精通》——2.4 Design Entry CIS原理图图形界面...
- 解决ueditor jquery javascript 取值问题
- oracle表重命名 索引,CSS_在Oracle数据库中按用户名重建索引的方法,如果你管理的Oracle数据库下某 - phpStudy...
- Qt文档阅读笔记-写一个简单的单元测试
- java zip压缩_压缩工具
- SpringBoot-从入门到放弃(二) 开发环境的搭建
- 95-190-035-源码-window-Time Window 实现
- 错误记录( 六)tomcat 配置图片虚拟路径不起作用
- Java正则表达式例子汇总
- mysql 子查询 博客_mysql——多表——子查询——示例
- mouse_event() 控制鼠标操作
- 不用担心JDK17收费了,Oracle 推出 JDK 8 的升级替代品
- element-ui tabs组件导致页面假死浏览器崩溃
- 开源ESB服务总线记录
- Android Studio 使用本地gradle的配置
- 八.国民技术MCU开发之 XFMC模块之PSRAM
- 计算机应用基础任务教化2010,【计算机应用论文】茶文化下的计算机应用基础课程改革(共5535字)...
热门文章
- 淘宝网上线 | 历史上的今天
- 非线性悬架,UKF状态估计 采用模块化建模方法,搭建空气悬架模型,UKF状态估计模型,可实现悬架动挠度等状态估计
- N 本 Android PDF 电子书
- X86 硬件底层之debugborland c++显示1-100递增及打印“99”
- 民法典计算机论题相关辑录
- 异贝,通过移动互联网技术,为中小微实体企业联盟、线上链接、线上线下自定义营销方案推送。案例41
- js学习(新浪微博实习3)
- Non Uniform Memory Access
- 2020年,元旦开博送祝福了。
- 程序员的生存技巧 — 搜索技巧