Jquery Uploadify多文件上传带进度条且传递自己的参数


Posted in Javascript onAugust 28, 2013
<%@ 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/<% = DateTime.Now.ToString("yyyyMMdd") %>', //上传文件夹的路径按20130416 
'queueID': 'fileQueue', //页面中,你想要用来作为文件队列的元素的id 
'auto': false, //当文件被添加到队列时,自动上传 
'multi': true, //设置为true将允许多文件上传 
'fileExt': '*.jpg;*.gif;*.png', //允许上传的文件后缀 
'fileDesc': 'Web Image Files (.JPG, .GIF, .PNG)', //在浏览窗口底部的文件类型下拉菜单中显示的文本 
'sizeLimit': 102400, //上传文件的大小限制,单位为字节 100k 
'onAllComplete': function (event, data) { //当上传队列中的所有文件都完成上传时触发 
alert(data.filesUploaded + ' 个文件上传成功!'); 
} 
}); 
}); 
function uploadpara() { 
//自定义传递参数 
$('#uploadify').uploadifySettings('scriptData', { 'name': $('#txtName').val(), 'albums': $('#txtAlbums').val() }); 
$('#uploadify').uploadifyUpload(); 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
用户名:<asp:TextBox ID="txtName" runat="server"></asp:TextBox><br/> 
相册名:<asp:TextBox ID="txtAlbums" runat="server"></asp:TextBox> 
</div> 
</form> 

<div id="fileQueue"></div> 
<input type="file" name="uploadify" id="uploadify" /> 
<p> 
<a href="javascript:void(0);" onclick="uploadpara();">上传</a>| 
<a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上传</a> 
</p> 
</body> 
</html>

<%@ WebHandler Language="C#" Class="UploadHandler" %> using System; 
using System.Web; 
using System.IO; 
/// <summary> 
/// UploadHandler文件上传 
/// </summary> 
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"]); 
string name = context.Request.Params["name"]; //获取传递的参数 
string albums = context.Request.Params["albums"]; 
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; 
} 
} 
}
Javascript 相关文章推荐
jquery与google map api结合使用 控件,监听器
Mar 04 Javascript
基于jQuery的可用于选项卡及幻灯的切换插件
Mar 28 Javascript
javascript实现焦点滚动图效果 具体方法
Jun 24 Javascript
javascript:文字不间断向左移动的实例代码
Aug 08 Javascript
js控制淡入淡出示例代码
Nov 12 Javascript
javascript正则表达式基础知识入门
Apr 20 Javascript
举例详解Python中smtplib模块处理电子邮件的使用
Jun 24 Javascript
jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法
Jan 18 Javascript
Vue-cli项目获取本地json文件数据的实例
Mar 07 Javascript
微信小程序实现页面下拉刷新和上拉加载功能详解
Dec 03 Javascript
详解关于Angular4 ng-zorro使用过程中遇到的问题
Dec 05 Javascript
解决vue初始化项目时,一直卡在Project description上的问题
Oct 31 Javascript
ExtJS DOM元素操作经验分享
Aug 28 #Javascript
地址栏传递中文参数乱码在js里用escape转码
Aug 28 #Javascript
在JavaScript中实现类的方式探讨
Aug 28 #Javascript
实用的Jquery选项卡TAB示例代码
Aug 28 #Javascript
jQuery实现图片信息的浮动显示实例代码
Aug 28 #Javascript
JQuery筛选器全系列介绍
Aug 27 #Javascript
HTML Color Picker(js拾色器效果)
Aug 27 #Javascript
You might like
PHP 中执行系统外部命令
2006/10/09 PHP
PHP5中的时间相差8小时的解决办法
2008/03/28 PHP
PHP文件读写操作之文件读取方法详解
2011/01/13 PHP
一波PHP中cURL库的常见用法代码示例
2016/05/06 PHP
PHP开发实现快递查询功能详解
2019/04/08 PHP
HTTP头隐藏PHP版本号实现过程解析
2020/12/09 PHP
Javascript 构造函数 实例分析
2008/11/26 Javascript
js 手机号码合法性验证代码集合
2012/09/29 Javascript
JS实现日期加减的方法
2013/11/29 Javascript
js实现二代身份证号码验证详解
2014/11/20 Javascript
jQuery中unbind()方法用法实例
2015/01/19 Javascript
jQuery实现信息提示框(带有圆角框与动画)效果
2015/08/07 Javascript
JavaScript实现倒计时代码段Item1(非常实用)
2015/11/03 Javascript
Bootstrap组合上、下拉框简单实现代码
2017/03/06 Javascript
Angular实现的简单定时器功能示例
2017/12/28 Javascript
vue实现PC端录音功能的实例代码
2019/06/05 Javascript
Vue项目打包压缩的实现(让页面更快响应)
2020/03/10 Javascript
[01:12](回顾)DOTA2国际邀请赛,全世界DOTAer的盛宴
2014/07/01 DOTA
[02:01]大师之路——DOTA2完美大师赛11月论剑上海
2017/11/06 DOTA
Python中使用wxPython开发的一个简易笔记本程序实例
2015/02/08 Python
Python 内置函数complex详解
2016/10/23 Python
使用python存储网页上的图片实例
2018/05/22 Python
Python socket 套接字实现通信详解
2019/08/27 Python
python实现生成Word、docx文件的方法分析
2019/08/30 Python
python实现简单学生信息管理系统
2020/04/09 Python
CSS3中伪元素::before和::after的用法示例
2017/09/18 HTML / CSS
HTML5 Canvas 旋转风车绘制
2017/08/18 HTML / CSS
可能这些是你想要的H5软键盘兼容方案(小结)
2019/04/23 HTML / CSS
amazeui页面分析之登录页面的示例代码
2020/08/25 HTML / CSS
英国护发和美妆在线商店:Klip Shop
2019/03/24 全球购物
const char*, char const*, char*const的区别是什么
2014/07/09 面试题
税务会计岗位职责
2014/02/18 职场文书
群众路线领导班子四风对照检查材料
2014/09/27 职场文书
公司员工离职证明书
2014/10/04 职场文书
销售经理工作检讨书
2015/02/19 职场文书
python自动获取微信公众号最新文章的实现代码
2022/07/15 Python