JQUERY UI DOWNLOAD
JQUERY UI DOWNLOAD
jDownload是jQuery的一个下载插件,用户可以在下载文件之前知道文件的详细信息,在提高用户体验度方面起到了很大的作用。
鉴于官网的Demo是通过PHP文件来获取资源信息,对于ASP.NET开发人员来说不是很容易理解,所以本人写了一个ASP.NET的版本希望对jQuery有爱的童鞋们有所帮助。
一、首先添加一个测试页面Default.aspx,引用测试脚本和样式。

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/base/jquery-ui.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="/jquery.jDownload.css"/>
<script type="text/javascript" src="/jquery.jDownload.js"></script>
<script type="text/javascript">
$(document).ready(function() {
/* basic usage */
$('.download').jDownload();
});
</script>

在body里添加测试代码

<div>
<p>
<a href="images/hubble1.jpg" class="download" title="这是图片1">Download here</a></p>
<p>
<a href="images/hubble2.jpg" class="download" title="这是图片2">Download here</a></p>
<p>
<a href="images/hubble3.jpg" class="download" title="这是图片3">Download here</a></p>
<a id="download" class="download" href="ReportTemplates/测试.xls">导出</a>
</div>

二、添加一个提供获取信息及下载用的页面jdownload.aspx,在cs文件中编写以下代码。

1 using System;
2 using System.IO;
3 using System.Runtime.Serialization;
4 using System.Runtime.Serialization.Json;
5 using System.Text;
6 using System.Web;
7
8 namespace JDownload
9 {
10 public partial class jdownload : System.Web.UI.Page
11 {
12 string action = string.Empty;
13 string path = string.Empty;
14
15 protected void Page_Load(object sender, EventArgs e)
16 {
17 action = Request.QueryString["action"];
18 path = Server.UrlDecode(Request.QueryString["path"]);
19
20 if (!String.IsNullOrEmpty(path))
21 {
22 switch (action)
23 {
24 case"download":
25 GetFile(path);
26 break;
27
28 case"info":
29 GetInfo(path);
30 break;
31 }
32 }
33 Response.Write(GetJson(new MyFileInfo() { Error ="error" }));
34 Response.End();
35 }
36
37 private void GetFile(string path)
38 {
39 // get file info
40 FileInfo fi =new FileInfo(Server.MapPath(path));
41 string fileName = fi.Name;//客户端保存的文件名
42 string filePath = Server.MapPath(path);//路径
43 //以字符流的形式下载文件
44 FileStream fs =new FileStream(filePath, FileMode.Open);
45 byte[] bytes =newbyte[(int)fs.Length];
46 fs.Read(bytes, 0, bytes.Length);
47 fs.Close();
48 Response.ContentType ="application/octet-stream";
49 //通知浏览器下载文件而不是打开
50 Response.AddHeader("Content-Disposition", "attachment; filename="+ HttpUtility.UrlEncode(fileName, System.Text.Encoding.UTF8));
51 Response.BinaryWrite(bytes);
52 Response.Flush();
53 Response.End();
54 }
55
56 private void GetInfo(string path)
57 {
58 // get file info
59 FileInfo fi =new FileInfo(Server.MapPath(path));
60 MyFileInfo myFileInfo =new MyFileInfo()
61 {
62 FileName = fi.Name,
63 FileType = fi.Extension,
64 FileSize = (fi.Length /long.Parse("1024")).ToString(),
65 Error ="null"
66 };
67 Response.Write(GetJson(myFileInfo));
68 Response.End();
69 }
70
71
72 public static string GetJson<T>(T obj)
73 {
74 DataContractJsonSerializer json =new DataContractJsonSerializer(typeof(T));
75 using (MemoryStream ms =new MemoryStream())
76 {
77 json.WriteObject(ms, obj);
78 string szJson = Encoding.UTF8.GetString(ms.ToArray());
79 return szJson;
80 }
81 }
82
83 [DataContract]
84 class MyFileInfo
85 {
86 [DataMember]
87 public string FileName { get; set; }
88 [DataMember]
89 public string FileType { get; set; }
90 [DataMember]
91 public string FileSize { get; set; }
92 [DataMember]
93 public string Error { get; set; }
94 }
95 }
96 }

三、注意事项
在使用 System.Runtime.Serialization.Json 时需要引用System.ServiceModel.Web的DLL
源码下载Click Me
JQUERY UI
jqGrid search oper
posted @ 2011-09-08 11:20 风来之东林| 编辑
jQuery UI Download
posted @ 2011-03-11 13:17 风来之东林 阅读(1255) | 评论 (1) 编辑
jQuery UI Multiselect
posted @ 2011-01-05 16:59 风来之东林 阅读(868) |评论 (0) 编辑
JQUERY UI DOWNLOAD的更多相关文章
- Asp.net mvc 添加Jquery UI
1.使用NuGet下载jquery ui Install-Package jQuery.UI.Combined 2.下载多语言文件: development-bundle/i18n目录下是jquery ...
- jquery------导入jquery UI要使用的文件
JQuery版本下载地址:http://jquery.com/download/ JQuer UI两个主要下载地址:http://jqueryui.com/download/ 只需要里面的jquer ...
- Web 在线文件管理器学习笔记与总结(6)jQuery UI 预览图片
① 查看文件内容,如果文件是图片类型,点击直接查看图片: ② 如果不是图片类型,显示文件中的内容: ③ 使用 jQuery UI 中的 Dialog 显示图片 a.引入: <script src ...
- jQuery UI vs EasyUI
几个UI框架的比较k: 目前工作中可能会常用到几个UI框架,如 Ext: http://docs.sencha.com/ext-js/4-1/#!/example 感觉其过于复杂,性能不高,所以一直没 ...
- Jquery UI的datepicker插件使用方法
原文链接;http://www.ido321.com/375.html Jquery UI是一个非常丰富的Jquery插件,并且UI的各部分插件可以独自分离出来使用,这是其他很多Jquery插件没有的 ...
- jQuery UI dialog 的使用
今天用到了客户端的对话框,把 jQuery UI 中的对话框学习了一下. 准备 jQuery 环境 首先,我们创建一个按钮,点击这个按钮的时候,将会弹出一个对话框. 1 <input type= ...
- Jquery UI的datepicker插件使用
原文链接;http://www.ido321.com/375.html Jquery UI是一个非常丰富的Jquery插件,而且UI的各部分插件能够独自分离出来使用.这是其它非常多Jquery插件没有 ...
- jQuery UI Datepicker&Datetimepicker添加 时-分-秒 并且,判断
jQuery UI Datepicker时间(年-月-日) 相关代码: <input type="text" value="" name="ad ...
- Jquery ui datepicker 设置日期范围,如只能隔3天
最近的后台项目前端使用了jquery ui 日历控件自然就使用了jquery ui 的 datepicker 后台数据比较好大,一般是千万级的和百万级的关联,查询会很慢,所以后加想多加些过滤条件, ...
随机推荐
- Bag标签之中的一个行代码实行中文分词实例1
例1: 分词(返回以逗号隔开的词组,gap=",") <bagid=pPage act=2words name=words gap=",">我喜欢黄 ...
- HTML DOCTYPE 重要性
定义和使用方法 <!DOCTYPE> 声明必须是 HTML 文档的第一行.位于 <html> 标签之前. <!DOCTYPE> 声明不是 HTML 标签.它是指示 ...
- ar命令提取.a时刻,一个错误 is a fat file (use libtool(1) or lipo(1) and ar(1) on it)
在减压.a当文件,据报一个类别似 xxx.a is a fat file (use libtool(1) or lipo(1) and ar(1) on it)的错误,经过查找资料,原来是由于该.a文 ...
- Socket 学习(三).5 UDP 的弱点
前面 讲到了,udp 传输文本的例子,发现 udp 确实 比tcp 高效一些,现在我用来传输文件,问题果然来了,结果发现 他不能一次 传输大于 64K的东西! 那么 我自然想到了 切包,多次发送,再合 ...
- 工作流Jpbm4.4工作流知识点总结(工作流开发宝典)
原文:工作流Jpbm4.4工作流知识点总结(工作流开发宝典) Jbpm工作流开发过程中的一些知识点总结,方便以后开发使用! 目录: 一.工作流框架的搭建 二.工作流框架的流程开发 1.管理流程定义 ① ...
- HDU 4052 Adding New Machine(矩形面积并)
Adding New Machine Problem Description Incredible Crazily Progressing Company (ICPC) suffered a lot ...
- 常见浏览器扩展开发笔记(chrome firefox 360 baidu qq sougou liebao uc opera)
浏览器扩展开发貌似时下很冷门啊,但是不少企业还是有类似的应用,360的抢票插件啊,笔者最近在做的网页翻译扩展之类的.笔者在开发的过程中,遇到了不少坑,说是坑,说白了就是各个厂商支持的API不统一导致的 ...
- nginx 查看并发连接数
这里仅仅说一下用命令查看(也可配置页面) 通过查tcp连接数 1.netstat -n | awk '/^tcp/ {++S[$NF]} END {for(a in S) print a, S[a]} ...
- SQL点滴25—T-SQL面试语句,练练手
原文:SQL点滴25-T-SQL面试语句,练练手 1. 用一条SQL语句查询出每门课都大于80分的学生姓名 name kecheng fenshu 张三 语文 81张三 ...
- SQL点滴21—几个有点偏的语句
原文:SQL点滴21-几个有点偏的语句 SQL语句是一种集合操作,就是批量操作,它的速度要比其他的语言快,所以在设计的时候很多的逻辑都会放在sql语句或者存储过程中来实现,这个是一种设计思想.但是今天 ...