`

asp.net(fileupload)上传图片预览

阅读更多
<script language="javascript">
function $(o){return document.getElementById(o);}
function CheckImgCss(o,img)
{
    
if (!/\.((jpg)|(bmp)|(gif)|(png))$/ig.test(o.value))
    
{
        alert(
'只能上传jpg,bmp,gif,png格式图片!');
        o.outerHTML 
= o.outerHTML;
    }

    
else
    
{
        $(img).filters.item(
"DXImageTransform.Microsoft.AlphaImageLoader").src=o.value;
        
//$('Image1').src = o.value;//这里IE7已经不支持了。所以才有上面的方法。
    }

}

</script>
    
<form id="form1" runat="server">
    
<div><h1>一次上传多个图片并预览,请选择图片:</h1>
        
<asp:FileUpload ID="FileUpload1" onchange="CheckImgCss(this, 'img');" runat="server" />
        
<asp:FileUpload ID="FileUpload2" onchange="CheckImgCss(this, 'img');" runat="server" />
        
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="上传" />
        
<div id="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=<%= pic%>,sizingMethod=scale);width:102px;height:100px;"></div>
        
</div>


using System;
using System.Data;
using System.Configuration;
using System.Collections;
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 UploadPicture
{
    
public partial class _Default : System.Web.UI.Page
    
{
        
//该变量用来修改的的时候的默认值。例如上传自己的头像,如果用户修改头像,这里可以显示他原来的头像。
        public string pic = "http://www.svnhost.cn/images/logo.gif";
        
protected void Page_Load(object sender, EventArgs e)
        
{

        }


        
protected void Button1_Click(object sender, EventArgs e)
        
{
            Random r 
= new Random();
            
//这样循环,可以同时上传多个文件。前台已经有文件格式的判断,有错误提示了。这里只要过滤掉非法文件即可,无需提示了。
            for (int i = 0; i < Request.Files.Count; i++)
            
{
                
if (Request.Files[i].ContentLength > 0)
                
{
                    
string ex = System.IO.Path.GetExtension(Request.Files[i].FileName).ToLower();
                    
if (".jpg.gif.png.bmp".Contains(ex))
                    
{
                        
string newFileName = DateTime.Now.ToString("yyyyMMddHHmmss"+ r.Next(100999).ToString() + ex;
                        
//保存文件名到数据库
                        
//xxxxxxxxxxxxxxxx
                        
//xxxxxxxxxxxxxxxx

                        Request.Files[i].SaveAs(Server.MapPath(newFileName));
                        pic 
= newFileName;
                    }

                }

            }

        }

    }

}

分享到:
评论

相关推荐

    Asp.net FileUpload控件 预览

    在ASP.NET中,FileUpload控件是一个非常实用的组件,用于允许用户在Web应用程序中上传文件,特别是图像文件。在某些场景下,我们可能需要在用户实际上传文件之前提供一个预览功能,让用户看到即将上传的图片效果。...

    asp.net vs2012 fileupload 图片上传前预览

    在ASP.NET平台上,Visual Studio 2012提供了一个强大的工具集来开发Web应用程序,其中包括FileUpload控件,它允许用户选择并上传文件到服务器。然而,在用户提交文件之前,有时我们希望提供一个图片预览功能,让用户...

    asp.net使用fileupload上传图片并预览

    一个`&lt;asp:Button&gt;`用于触发上传操作,`&lt;asp:Label&gt;`用于显示错误或成功消息,而`&lt;asp:Image&gt;`则用于预览上传的图片。`runat="server"`属性使这些控件能在服务器端被识别和处理。 2. **后台代码**:在C#中,`Page_...

    fileupload上传图片前预览

    在ASP.NET开发中,FileUpload控件是用于处理用户上传文件的核心组件,特别是处理图片上传时,为了提供更好的用户体验,通常需要在用户正式提交前实现图片预览功能。这一功能可以减少用户因错误选择或不符合规格的...

    .NET 使用FileUpload上传并预览

    在.NET框架中,FileUpload控件是ASP.NET Web表单的一部分,用于实现用户从本地计算机上传文件的功能。这个控件非常实用,特别是在处理用户需要上传图片或其他文件的应用场景中。以下将详细介绍如何使用FileUpload...

    ASP.NET 图片预览

    ASP.NET 图片预览技术是Web开发中一个实用的功能,特别是在用户需要上传图片并即时查看效果的场景下。本文将详细讲解如何在ASP.NET环境中实现图片上传后的即时预览,以及考虑不同浏览器的兼容性问题。 首先,我们...

    .net批量上传图片带预览功能

    FileUpload控件在老版本的ASP.NET中非常常见,而在现代浏览器中,HTML5的FormData可以更好地处理多文件上传。 图片预览:预览功能允许用户在上传前查看所选图片,确保图片质量、方向等符合预期。这通常通过...

    Asp.net图片上传实现预览效果的简单代码

    在页面上放入一个上传控件和一个图片控件. 代码如下: &lt;asp ID=”FileUpload1″ runat=”server” xss=removed&gt; &lt;asp ID=”Image1″ runat=”server” &gt; 在上传控件中写onpropertychange=”show(this.value)”...

    asp.net 批量上传图片demo

    本示例“asp.net 批量上传图片demo”是基于.NET框架3.5开发的一个实例,它实现了用户可以一次性上传多张图片,并且在上传过程中提供图片预览功能,还特别强调了对大图上传的支持。以下将详细讲解这个知识点。 1. **...

    asp.net上传时图片预览

    在ASP.NET中,图片上传和预览功能是网站开发中常见的需求,特别是在用户需要上传个人头像、商品图片或者发布含有图像内容的信息时。本文将详细介绍如何在ASP.NET环境中实现图片的上传和预览功能,以及批量上传的处理...

    【ASP.NET编程知识】asp.net fileupload控件上传文件与多文件上传.docx

    ASP.NET中的FileUpload控件是用于用户在网页上选择并上传文件到服务器的关键组件。它在ASP.NET编程中扮演着重要角色,特别是在处理用户需要提交本地文件到服务器的应用场景下,如图片上传、文档共享等。 在提供的...

    ASP.NET中上传控件FileUpload的项目示例

    ASP.NET中的FileUpload控件是开发Web应用时用于处理用户文件上传功能的重要工具。这个控件使得用户可以在网页上选择本地文件并将其上传到服务器,从而实现数据交互。以下是对"ASP.NET中上传控件FileUpload的项目示例...

    ASP.NET批量上传图片

    在ASP.NET中,批量上传图片是一项常见的功能,尤其在构建涉及用户交互的Web应用程序时,如社交媒体、电子商务网站或内容管理系统。批量上传允许用户一次性上传多个图片,提高用户体验并减轻服务器压力。以下是对这一...

    ASP.NET图片批量上传,可预览带进度条

    在ASP.NET中,文件上传主要通过`&lt;asp:FileUpload&gt;`控件实现。用户选择文件后,这些文件将以表单数据的形式发送到服务器。为了支持批量上传,可以使用HTML5的`multiple`属性,允许用户一次选择多个文件。但是,需要...

    asp.net fileupload控件上传图片并预览图片

    本文为大家分享了fileupload控件实现上传图片后并进行预览图片的功能,并对web.config进行了配置,先看一下最终效果: 页面代码: &lt;form id=form1 runat=server&gt; &lt;asp ID=FileUpload1 runat=server&gt; ...

    ASP.NET多文件上传 带预览

    此示例"ASP.NET多文件上传 带预览"着重展示了如何实现用户在上传文件前预览图片的功能,以及如何将这些文件存储到服务器上。以下是对这个功能的详细解释: 1. **多文件选择**:在HTML5中,`&lt;input&gt;`标签的`type=...

    asp.net 多图片上传 可预览 兼容火狐 IE

    1. **文件上传控件**:ASP.NET提供了FileUpload控件,允许用户选择本地文件进行上传。在多图片上传中,可能需要多个FileUpload控件或者一个支持多选的FileUpload控件。 2. **JavaScript与AJAX**:为了实现图片预览...

    Asp.net 2.0 用FileUpload 控件实现多文件上传

    在Asp.net 2.0框架中,FileUpload控件是用于处理用户上传文件的核心组件。这个控件允许用户从他们的计算机选择一个或多个文件,然后将这些文件上传到服务器。在本文中,我们将深入探讨如何利用FileUpload控件实现多...

    asp.net上传图片示例代码

    本文将深入探讨“asp.net上传图片示例代码”这一主题,通过分析给定的代码片段,我们将了解在ASP.NET中如何处理图像上传,并探索其中的关键知识点。 ### ASP.NET中的图像上传 #### 1. **JavaScript验证图像格式** ...

    FileUpload控件自动上传

    - 在ASP.NET页面中,可以通过拖放或手动添加来插入FileUpload控件。 - 用户在客户端选择文件后,文件信息会被存储在控件的`PostedFile`属性中。 2. **自动上传事件** - 默认情况下,FileUpload控件的上传行为是...

Global site tag (gtag.js) - Google Analytics