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 相关文章推荐
js 日期转换成中文格式的函数
Jul 07 Javascript
javascript tips提示框组件实现代码
Nov 19 Javascript
设置jsf的选择框h:selectOneMenu为不可编辑状态的方法
Jan 07 Javascript
jQuery基于当前元素进行下一步的遍历
May 20 Javascript
JS动态修改图片的URL(src)的方法
Apr 01 Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
Jan 19 Javascript
javascript HTML+CSS实现经典橙色导航菜单
Feb 16 Javascript
浅谈JS之iframe中的窗口
Sep 13 Javascript
JavaScript 函数的定义-调用、注意事项
Apr 16 Javascript
详解Node.js中exports和module.exports的区别
Apr 19 Javascript
vue项目持久化存储数据的实现代码
Oct 01 Javascript
JS使用H5实现图片预览功能
Sep 30 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
php pcntl_fork和pcntl_fork 的用法
2009/04/13 PHP
php旋转图片90度的方法
2013/11/07 PHP
Thinkphp中的curd应用实用要点
2015/01/04 PHP
PHP实现文件下载【实例分享】
2017/04/28 PHP
phpstorm激活码2020附使用详细教程
2020/09/25 PHP
Ext面向对象开发实践(续)
2008/11/18 Javascript
javascript 模式设计之工厂模式详细说明
2010/05/10 Javascript
基于jQuery的动态表格插件
2011/03/28 Javascript
JavaScript初学者应注意的七个细节详细介绍
2012/12/27 Javascript
js校验表单后提交表单的三种方法总结
2014/02/28 Javascript
js实现仿百度瀑布流的方法
2015/02/05 Javascript
使用Jquery实现每日签到功能
2015/04/03 Javascript
XMLHttpRequest Level 2 使用指南
2016/08/26 Javascript
前端框架学习总结之Angular、React与Vue的比较详解
2017/03/14 Javascript
关于Node.js中Buffer的一些你可能不知道的用法
2017/03/28 Javascript
BootStrap 导航条实例代码
2017/05/18 Javascript
JavaScript中this关键字用法实例分析
2018/08/24 Javascript
js实现简单点赞操作
2020/03/17 Javascript
Vue Cli3 打包配置并自动忽略console.log语句的方法
2020/04/23 Javascript
Vue发布订阅模式实现过程图解
2020/04/30 Javascript
[03:17]2014DOTA2 国际邀请赛中国区预选赛 四强专访
2014/05/23 DOTA
[00:37]2016完美“圣”典风云人物:AMS宣传片
2016/12/06 DOTA
对pandas进行数据预处理的实例讲解
2018/04/20 Python
Python实现删除时保留特定文件夹和文件的示例
2018/04/27 Python
python 编写简单网页服务器的实例
2018/06/01 Python
Win10下python 2.7.13 安装配置方法图文教程
2018/09/18 Python
PyTorch的深度学习入门教程之构建神经网络
2019/06/27 Python
python mysql中in参数化说明
2020/06/05 Python
matplotlib subplot绘制多个子图的方法示例
2020/07/28 Python
如何用PyPy让你的Python代码运行得更快
2020/12/02 Python
HTML5 Canvas像素处理使用接口介绍
2012/12/02 HTML / CSS
《真想变成大大的荷叶》教学反思
2014/04/14 职场文书
员工年终自我评价
2014/09/14 职场文书
学校拾金不昧表扬信
2015/01/16 职场文书
八年级历史教学反思
2016/02/19 职场文书
Go Gin实现文件上传下载的示例代码
2021/04/02 Golang