效果图

支持ie6+,chrome,ie6中文文件名会显示乱码.

上传时候会显示进度条.

需要jquery.uploadify.js插件,稍后会给出下载

前台代码

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <script src="fileupload/jquery-1.4.4.min.js" type="text/javascript" language="javascript"></script>

<!-- 脚本部分提示修改为中文 -->

    <script src="fileupload/jquery.uploadify.js" type="text/javascript" language="javascript"></script>

    <link href="fileupload/uploadify.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" language="javascript">

    $(function() {

        $("#file_upload").uploadify({

            'auto': false,                      //是否自动上传

            'swf': 'fileupload/uploadify.swf',      //上传swf控件,不可更改

            'uploader': 'Handler.ashx',            //上传处理页面,可以aspx

            'fileTypeDesc':'pdf文件或者图像',

            'fileTypeExts':'*.pdf;*.jpg;*.jpeg;*.gif;*.png',   //文件类型限制,默认不受限制

            'buttonText':'浏览文件',//按钮文字

            'width'     :100,

            'height'    :26,

            //最大文件数量'uploadLimit':

            'multi'     :false,//单选

            'fileSizeLimit':'20MB',

            'queueSizeLimit':1,  //队列限制

            'removeCompleted' : false

        });

    });

    </script>

    <title>Jquery文件上传</title>

</head>

<body>

    <form id="form1" runat="server">

        <input type="file" name="file_upload" id="file_upload" />

        <a href="javascript:$('#file_upload').uploadify('cancel')" >删除</a><!-- 删除文件实际操作通过ajax提交. -->

        <a href="javascript:$('#file_upload').uploadify('upload','*')">Upload Files</a>

        <br />

        <br />

        <br />

        <br />

        <br />

        <br />

        api参考:&nbsp;http://www.uploadify.com/documentation/

    </form>

</body>

</html>

后台无,

处理ashx页面代码:

<%@ WebHandler Language="C#" Class="Handler" %>

using System;

using System.Web;

public class Handler : IHttpHandler {

    public void ProcessRequest (HttpContext context) {

        if (context.Request.Files.Count > )

        {

            //HttpContext.Current.Request.FilePath;

            string strPath = System.Web.HttpContext.Current.Server.MapPath("~/upload/");

            string strName = context.Request.Files[].FileName;

            context.Request.Files[].SaveAs(System.IO.Path.Combine(strPath, strName));

        }

    }

    public bool IsReusable {

        get {

            return false;

        }

    }

}

下载地址

http://download.csdn.net/detail/wukaiping870123/6259419

ASP.NET Jquery+ajax上传文件(带进度条)的更多相关文章

  1. asp.net mvc 实现上传文件带进度条

    本文乃是博主早期写的,此种思路虽然实现了,但固然不是最好的,仅做参考学习. 可以用js onprogress .fileinput .webuploader.jq ajaxsubmit等实现 思路:a ...

  2. Extjs 使用fileupload插件上传文件 带进度条显示

    一.首先我们看看官方给出的插件的解释: 一个文件上传表单项具有自定义的样式,并且可以控制按钮的文本和 像文本表单的空文本类似的其他特性. 它使用一个隐藏的文件输入元素,并在用户选择文件后 在form提 ...

  3. FormData上传文件 带进度条

    * jQuery ajax  FormData 上传文件 template $.ajax({ url: url, type: 'POST', data: new FormData(form), dat ...

  4. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  5. jQuery ajax上传文件实例

    jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...

  6. java进行文件上传，带进度条

    网上看到别人发过的一个java上传的代码,自己写了个完整的,附带源码 项目环境:jkd7.tomcat7. jar包:commons-fileupload-1.2.1.jar.commons-io-1 ...

  7. ajax上传文件显示进度

    下面要做一个ajax上传文件显示进度的操作,文末有演示地址 这里先上代码: 1.前端代码 upload.html <!DOCTYPE html> <html lang="e ...

  8. flask jQuery ajax 上传文件

    1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...

  9. 【Web】前端文件上传，带进度条

    最近做项目发现,在文件上传的过程中,增加进度条,能大大改善用户体验.本例介绍带进度条的文件上传 环境搭建 参考:[Java]JavaWeb文件上传和下载. 原生ajax上传带进度条 <%@ pa ...

随机推荐

  1. table应用之colspan与rowspan

    <table border=" borderColorDark="#66ff33"> <tr> <td rowspan=" ali ...

  2. MIME邮件格式

    转自:http://kptu.iteye.com/blog/890180 排版做了调整. Q.什么是MIME?什么是MIME邮件? A. MIME, 全称为"Multipurpose Int ...

  3. C# 异步操作 async await 的用法

    1. async与 await 成对出现 async 在方法前使用 ,方法体面面用  await . 2. 使用async 和await定义异步方法不会创建新线程. 3.await 后面一定是一个扫行 ...

  4. Worm

    Description 自从见识了平安夜苹果的涨价后,Lele就在他家门口水平种了一排苹果树,共有N棵. 突然Lele发现在左起第P棵树上(从1开始计数)有一条毛毛虫.为了看到毛毛虫变蝴蝶的过程,Le ...

  5. Javascript模块化开发－轻巧自制

    Javascript模块化开发-轻巧自制 一.前言现在javascript的流行,前端的代码越来越复杂,所以我们需要软件工程的思想来开发前端.模块化是必不可少的,这样不仅能够提高代码的可维护性.可扩展 ...

  6. jsoup 获取指定页面的所有链接（需后续完善）

    java代码如下: import java.io.IOException; import org.jsoup.Jsoup; import org.jsoup.nodes.Document; impor ...

  7. cocos2d-x CCEditBox 字符不能显示完全的bug

    cocos2d-x CCEditBox 字符不能显示完全的bug (cocos2dx版本 2.2.0)用CCEditBox制作帐号输入框,当输入的内容超过框的宽度时,框里面不会显示当前输入的字符,显示 ...

  8. C#学习7

    一.变量交换 ; ; Console.WriteLine("开始a={0},b={1}",a,b); a = a + b; b = a - b; a = a - b; Consol ...

  9. Google软件测试

    google测试相关的职位有三类:软件测试开发工程师.测试工程师以及测试工程经理. 软件测试开发工程师也是一个开发角色,只是工作重心在可测试性和通用测试框架上.他们参与设计评审,非常近距离地观察代码质 ...

  10. Hadoop2.2 federnation联盟的搭建

    联盟实际上是一个单独的集群,集群里面包含很多的NameService共享同样的DataNode,同一份数据只上传一份,block块相同,一个集群中删除,另一个集群中还是存在的.同一份数据只是在name ...