Jquery Uploadify上传带进度条介绍

 本篇文章主要是对Jquery Uploadify上传带进度条的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助

 代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UpLoad.aspx.cs" Inherits="UploadifyDemo_UpLoad" %>
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Jquery Uploadify上传带进度条</title>
    <link href="js/jquery.uploadify-v2.1.4/uploadify.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/swfobject.js"></script>
    <script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery.uploadify.v2.1.4.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#uploadify").uploadify({
                'uploader': 'js/jquery.uploadify-v2.1.4/uploadify.swf', //uploadify.swf文件的路径
                'script': 'UploadHandler.ashx', //处理文件上传的后台脚本的路径
                'cancelImg': 'js/jquery.uploadify-v2.1.4/cancel.png',
                'folder': 'UploadFile/<% = subpathName %>', //上传文件夹的路径
                'queueID': 'fileQueue', //页面中,你想要用来作为文件队列的元素的id
                'auto': false, //当文件被添加到队列时,自动上传
                'multi': true, //设置为true将允许多文件上传
                'fileExt': '*.jpg;*.gif;*.png', //允许上传的文件后缀
                'fileDesc': 'Web Image Files (.JPG, .GIF, .PNG)', //在浏览窗口底部的文件类型下拉菜单中显示的文本
                'sizeLimit': 102400,  //上传文件的大小限制,单位为字节 100k
                'onCancel': function (event, ID, fileObj, data) { //当从上传队列每移除一个文件时触发一次
                    alert('The upload of ' + fileObj.name + ' has been canceled!');
                },
                'onComplete': function (event, ID, fileObj, response, data) { //每完成一次文件上传时触发一次
                    alert('There are ' + data.fileCount + ' files remaining in the queue.');
                },
                'onAllComplete': function (event, data) { //当上传队列中的所有文件都完成上传时触发
                    alert(data.filesUploaded + ' files uploaded successfully!');
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
 
    </div>
    </form>
 
 
    <div id="fileQueue"></div>
    <input type="file" name="uploadify" id="uploadify" />
    <p>
        <a href="javascript:$('#uploadify').uploadifyUpload()">上传</a>| 
        <a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上传</a>
    </p>
</body>
</html>
代码如下:
<%@ WebHandler Language="C#" Class="UploadHandler" %>
 
using System;
using System.Web;
using System.IO;
 
public class UploadHandler : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/plain";
        context.Response.Charset = "utf-8";
 
        HttpPostedFile file = context.Request.Files["Filedata"];
        string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"]);
 
        if (file != null)
        {
            if (!Directory.Exists(uploadPath))
            {
                Directory.CreateDirectory(uploadPath);
            }
            file.SaveAs(Path.Combine(uploadPath, file.FileName));
            context.Response.Write("1");
        }
        else
        {
            context.Response.Write("0");
        }
    }
 
    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}
 
 

时间: 2016-02-13

Jquery Uploadify上传带进度条介绍的相关文章

Asp无组件上传带进度条(续)

上传|无组件 几个月前,写过一篇关于Asp无组件上传带进度条的Blog,当时主要分析了一下通过Web文件上传并在后台获取分析数据的实现原理.其中实现进度条的根本就是要实现分块获取数据,根据分块大小和块数记录已上传大小.还有一些具体的细节问题当时并没有说清楚: Q: 进度信息如何访问?A: 进度信息保存在Application中,每次上传时生成一个进度ID,根据这个进度ID可以检索Application中的当前上传进度信息. Q: 进度信息以什么形式保存在Application中?A: Asp太弱

jQuery Uploadify 上传插件出现Http Error 302 错误的解决办法_jquery

前段时间介绍过jquery uploadify上传插件的使用方法,我在使用中遇到过Http Error 302错误问题,应该会有很多人在使用中遇到过,在此记录下来: 首先http 302是请求被重定向的意思,这就很容易理解了,如果你的uploadify处理上传脚本有session验证,就会出现此错误,因为flash在执行post请求的时候没有包含cookie信息,而服务器的session会根据客户端的cookie来得到SESSIONID.没有提交cookie自然就不能获取到session,然后u

各位大神求赐教-struts2 上传视频进度条实现过程中 request对象问题

问题描述 struts2 上传视频进度条实现过程中 request对象问题 List formList = upload.parseRequest(request); 为了实现这条代码,在web.xml中配置了 changeRequest com.dlyk.framework.util.filter.GetServletRequest changeRequest*.action 这个配置就是为了request对象不被struts2 封装,不被封装的requestparseRequest(requ

asp.net使用jQuery Uploadify上传附件

 Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示,本文是一个简单的介绍Demo,主要是动态传递参数方法,通过formdata 向处理程序传递额外的表单数据 Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.Uploadify官方网址:http://www.uploadify.com/,在MVC中使用的方法可以参考 jQuery Uploadify在ASP.NET MVC3中的使用 和 Asp.net Mvc中使用uploadify实现

ASP上传的进度条实时反映上传情况

asp中使用组件上传时,有点麻烦就是不知道上传进度是多少,虽然有的提供了上传进度条,例如abcupload(下载地址:http://www.websupergoo.com)已经提供了显示当前上传状态的方法,里面就有专门的实例(在安装目录的Examples下面的progressupload.htm),它是提交数据的同时弹出一个反映进度的页面(progressbar.asp) 然后通过这个页面自刷新来每隔一点时间获取当时的上传状态,然后把它们显示出来,但是用页面自刷新的方法效率比较低,不不好调节刷新

改进文件上传的进度条,实时反映上传情况

上传 asp中使用组件上传时,有点麻烦就是不知道上传进度是多少,虽然有的提供了上传进度条,例如abcupload(下载地址:http://www.websupergoo.com)已经提供了显示当前上传状态的方法,里面就有专门的实例(在安装目录的Examples下面的progressupload.htm),它是提交数据的同时弹出一个反映进度的页面(progressbar.asp),然后通过这个页面自刷新来每隔一点时间获取当时的上传状态,然后把它们显示出来,但是用页面自刷新的方法效率比较低,不不好调

上传的进度条 实时反映上传情况

asp中使用组件上传时,有点麻烦就是不知道上传进度是多少,虽然有的提供了上传进度条,例如abcupload(下载地址:http://www.websupergoo.com)已经提供了显示当前上传状态的方法,里面就有专门的实例(在安装目录的Examples下面的progressupload.htm),它是提交数据的同时弹出一个反映进度的页面(progressbar.asp),然后通过这个页面自刷新来每隔一点时间获取当时的上传状态,然后把它们显示出来,但是用页面自刷新的方法效率比较低,不不好调节刷新

ASP.NET实现带进度条的文件上传(多种风格)

文件上传 带进度条 多种风格 非常漂亮!

基于jquery的上传插件Uploadify 3.1.1在MVC3中的使用

   Uploadify是JQuery的一个文件上传插件,实现的效果非常不错,目前已经更新到Version3.1.1,官方提供的实例是php版本的,本文将介绍Uploadify在MVC3中的使用,您可以点击以下链接,去官网查看文档,下载Uploadify插件. 下载Uploadify插件 查看文档  下载Uploadify插件,然后按照以下步骤,在MVC3中应用Uploadify3.1.1插件的上传功能吧. 1.创建MVC3工程,本例命名为UploadifyTest 2.把解压后的Uploadi