JQuery.uploadify 上传文件插件的使用详解 for ASP.NET


Posted in Javascript onJanuary 22, 2010

后来朋友推荐了一个这个叫uploadify的上传插件,似乎挺好,就到官方下了个示例运行,感觉挺好,自己再稍加美化一下就OK 了..!

接下来就讲讲使用过程吧:

1. 下载

   官方网站:http://www.uploadify.com/

   直接下载:jquery.uploadify-v2.1.0.rar

   我的Demo: MyUpload.rar                官方网站也有demo

   下载解压后:

      JQuery.uploadify 上传文件插件的使用详解 for ASP.NET

     说明:它里面有demo  但是是PHP的,还有一个帮助文档:uploadify v2.1.0 Manual.pdf.

2.创建工程:

    结构如图>>

    JQuery.uploadify 上传文件插件的使用详解 for ASP.NET

    文件说明:

     A.js文件夹下的所有文件:必需,从下载下来的包里解压复制过来,名字可以自己改改

   B.Default.aspx:测试页,后台没有代码

<%@ Page Language="C#" AutoEventWireup="true" Codebehind="Default.aspx.cs" Inherits="WebApplication2._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"> 
<title>jquery.uploadify 上传插件的使用</title> 
<link rel="Stylesheet" href="js/uploadify.css" /> 
<script type="text/javascript" src="js/jquery.min.js"></script> 
<script type="text/javascript" src="js/swfobject.js"></script> 
<script type="text/javascript" src="js/jquery.uploadify.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$("#uploadify").uploadify({ 
'uploader': 'js/uploadify.swf', 
'script': 'Upload.aspx', 
'cancelImg': 'js/cancel.png', 
'folder': 'upload', 
'queueID': 'fileQueue', 
'auto': false, 
'multi': true, 
}); 
}); 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<input type="file" name="uploadify" id="uploadify" /> 
<a href="javascript:$('#uploadify').uploadifyUpload()">上传</a>| <a href="javascript:$('#uploadify').uploadifyClearQueue()"> 取消上传</a> 
<div id="fileQueue"></div> 
</form> 
</body> 
</html>

C.Upload.aspx: 处理上传文件
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Upload.aspx.cs" Inherits="WebApplication2.Upload" %>

代码
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; 
using System.IO; 
namespace WebApplication2 
{ 
public partial class Upload : System.Web.UI.Page 
{ 
protected void Page_Load(object sender, EventArgs e) 
{ 
HttpPostedFile file = Request.Files["FileData"]; 
string uploadpath = Server.MapPath(Request["folder"] + "\\"); 
if (file != null) 
{ 
if (!Directory.Exists(uploadpath)) 
{ 
Directory.CreateDirectory(uploadpath); 
} 
file.SaveAs(uploadpath + file.FileName); 
Response.Write("1"); 
} 
else 
{ 
Response.Write("0"); 
} 
} 
} 
}

D.upload这个文件加也是必需
3.运行结果:

   JQuery.uploadify 上传文件插件的使用详解 for ASP.NET

4.最后说说:这个只是一个简单的入门例子,至于界面可以根据自己的需要去改

Javascript 相关文章推荐
在网页中屏蔽快捷键
Sep 06 Javascript
JavaScript 继承机制的实现(待续)
May 18 Javascript
Js 获取Gridview选中行的内容操作步骤
Feb 05 Javascript
完美兼容多浏览器的js判断图片路径代码汇总
Apr 17 Javascript
js鼠标点击按钮切换图片-图片自动切换-点击左右按钮切换特效代码
Sep 02 Javascript
JS+JSP通过img标签调用实现静态页面访问次数统计的方法
Dec 14 Javascript
关于session和cookie的简单理解
Jun 08 Javascript
微信小程序 video组件详解
Oct 25 Javascript
基于Javascript倒计时效果
Dec 22 Javascript
Angularjs通过指令监听ng-repeat渲染完成后执行脚本的方法
Dec 31 Javascript
JS实现微信摇一摇原理解析
Jul 22 Javascript
基于vue手写tree插件的那点事儿
Aug 20 Javascript
JQuery 构建客户/服务分离的链接模型中Table中的排序分析
Jan 22 #Javascript
JQuery 构建客户/服务分离的链接模型中Table分页代码效率初探
Jan 22 #Javascript
被jQuery折腾得半死,揭秘为何jQuery为何在IE/Firefox下均无法使用
Jan 22 #Javascript
jQuery 入门级学习笔记及源码
Jan 22 #Javascript
JQuery 确定css方框模型(盒模型Box Model)
Jan 22 #Javascript
Jquery实战_读书笔记2 选择器
Jan 22 #Javascript
Jquery实战_读书笔记1—选择jQuery
Jan 22 #Javascript
You might like
当年上海收录机产品生产,进口和价格情况
2021/03/04 无线电
php调整gif动画图片尺寸示例代码分享
2013/12/05 PHP
php遍历目录输出目录及其下的所有文件示例
2014/01/27 PHP
thinkphp在低版本Nginx 下支持PATHINFO的方法分享
2016/05/27 PHP
javascript引导程序
2008/10/26 Javascript
BOM与DOM的区别分析
2010/10/26 Javascript
JavaScript(JS) 压缩 / 混淆 / 格式化 批处理工具
2010/12/10 Javascript
DIY jquery plugin - tabs标签切换实现代码
2010/12/11 Javascript
解决checkbox的attr(checked)一直为undefined问题
2014/06/16 Javascript
jquery实现多行文字图片滚动效果示例代码
2014/10/10 Javascript
JavaScript实现N皇后问题算法谜题解答
2014/12/29 Javascript
javascript中call,apply,bind的用法对比分析
2015/02/12 Javascript
jQuery实现的小图列表,大图展示效果幻灯片示例
2016/10/25 Javascript
JS处理数据四舍五入(tofixed与round的区别详解)
2017/10/26 Javascript
Vue中computed与methods的区别详解
2018/03/24 Javascript
详解webpack-dev-server 设置反向代理解决跨域问题
2018/04/18 Javascript
解决vue项目打包后提示图片文件路径错误的问题
2018/07/04 Javascript
原生JS实现自定义下拉单选选择框功能
2018/10/12 Javascript
7个好用的JavaScript技巧分享(译)
2019/05/07 Javascript
微信小程序云开发之新手环境配置
2019/05/16 Javascript
JavaScript图片旋转效果实现方法详解
2020/06/28 Javascript
Jquery使用each函数实现遍历及数组处理
2020/07/14 jQuery
Vue中keep-alive的两种应用方式
2020/07/15 Javascript
[46:20]CHAOS vs Alliacne 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python使用reportlab画图示例(含中文汉字)
2013/12/03 Python
深入讲解Python编程中的字符串
2015/10/14 Python
python pandas修改列属性的方法详解
2018/06/09 Python
Pandas 同元素多列去重的实例
2018/07/03 Python
python三引号输出方法
2019/02/27 Python
Python GUI编程完整示例
2019/04/04 Python
Python 窗体(tkinter)按钮 位置实例
2019/06/13 Python
python报错: 'list' object has no attribute 'shape'的解决
2020/07/15 Python
详解python日志输出使用配置文件格式
2021/02/10 Python
python 获取计算机的网卡信息
2021/02/18 Python
地震捐款简报
2015/07/21 职场文书
详解PHP设计模式之依赖注入模式
2021/05/25 PHP