1.引入文件
jQuery.js(自行下载)
jquery.jdownload.js
jquery.jdownload.css(自行下载)
jquery-ui-1.8.16.custom.css(自行下载)
jquery-ui-1.8.16.custom.min.js(自行下载,包括相关图片)
jquery.jdownload.js文件
/*
* jDownload - A jQuery plugin to assist file downloads
* Examples and documentation at: http://jdownloadplugin.com
* Version: 1.3 (18/11/2010)
* Copyright (c) 2010 Adam Chambers, Tim Myers
* Licensed under the GNU General Public License v3: http://www.gnu.org/licenses/gpl.html
* Requires: jQuery v1.4+ & jQueryUI 1.8+
*/
(function ($) {
$.fn.jDownload = function (settings) {
var config = {
root: "",
fileId: "001",
event: "down", // default click event??
dialogTitle: "文件下载",
dialogDesc: '马上下载文件?',
dialogWidth: 450,
dialogHeight: 'auto',
dialogModal: false,
showfileInfo:true,
start: null,
stop: null,
download: null,
cancel: null
}
settings = $.extend(config, settings);
$("iframe.jDownloadFrame").next("div").remove();
$("iframe.jDownloadFrame").remove();
$("div.jDownloadDialog").remove();
var dialogID = "jDownloadDialog_" + $('.jDownloadDialog').length;
var iframeID = "jDownloadFrame_" + $('.jDownloadFrame').length;
//创建iframe和dialog
var iframeHTML = '<iframe class="jDownloadFrame" src="" id="' + iframeID + '"></iframe>';
var dialogHTML = '<div class="jDownloadDialog" title="' + settings.dialogTitle + '" id="' + dialogID + '"></div>';
//将iframe和dialog添加到文档
$('body').append(iframeHTML + dialogHTML);
var iframe = $('#' + iframeID);
var dialog = $('#' + dialogID);
//设置iframe样式
iframe.css({
"height": "0px",
"width": "0px",
"visibility": "hidden"
});
//设置dialog选项
dialog.dialog({
autoOpen: false,
buttons: {
"取消": function () {
if ($.isFunction(settings.cancel))
{
settings.cancel();
}
$(this).dialog('close');
//清除窗体
$("iframe.jDownloadFrame").remove();
$("iframe.jDownloadFrame").next("div").remove();
$("div.jDownloadDialog").remove();
},
"下载": function () {
if ($.isFunction(settings.download))
{
settings.download();
}
start_download();
}
},
width: settings.dialogWidth,
height: settings.dialogHeight,
close: function () {
if ($.isFunction(settings.stop))
{
settings.stop;
}
/*此处如果也用remove清除,360急速模式不兼容,所以改为隐藏*/
$("iframe.jDownloadFrame").css("display", "none");
$("iframe.jDownloadFrame").next("div").css("display", "none");
$("div.jDownloadDialog").css("display", "none");
},
modal: settings.dialogModal
});
$(this).bind(settings.event, function () {
if ($.isFunction(settings.start))
{
settings.start();
}
var _this = $(this);
dialog.html("");
var filePath = settings.filePath;
dialog.html('<p>正在获取文件信息...</p><img src="' + settings.root + 'Scripts/Download/loader.gif" alt="获取信息中" />');
$.ajax({
type: "POST",
url: settings.root + "Handlers/GetFiles.ashx",
data: { "opt": "get-file-info", fileId: settings.fileId },
dataType: "json",
error: function (XMLHttpRequest, textStatus, errorThrown) {
dialog.html("<p class=\"jDownloadError\">获取文件时出现错误</p>");
},
success: function (data) {
setTimeout(function () {
if (data.length == 0)
{
dialog.html("<p class=\"jDownloadError\">无法找到文件</p>");
}
else
{
if (settings.showfileInfo == true)
{
var html = "<div class=\"jDownloadInfo\">";
html += "<p><span>文件名称:</span> " + data[0] + "</p>";
html += "<p><span>文件类型:</span> " + data[1] + "</p>";
html += "<p><span>文件大小:</span> " + data[2] + " KB</p>";
html += "</div>";
//移除旧文件信息
$('.jDownloadInfo, .jDownloadError').remove();
var desc = (_this.attr('title') != null && _this.attr('title').length > 0) ? _this.attr('title') : settings.dialogDesc;
//添加描述信息
dialog.html('<p>' + desc + '</p>' + html);
}
}
}, 200);
}
});
//打开下载提示框
dialog.data('jDownloadData', { filePath: filePath }).dialog('open');
return false;
});
//开始下载
function start_download(i) {
iframe.attr('src', settings.root + 'Handlers/GetFiles.ashx?opt=download-file');
//关闭下载提示框
dialog.dialog('close');
return false;
}
}
})(jQuery);
2.GetFiles.ashx文件
public void ProcessRequest(HttpContext context)
{
string opt = string.IsNullOrEmpty(context.Request["opt"].ToString()) ? "" : context.Request["opt"].ToString();
switch (opt)
{
case "get-file-info": this.GetFileInfo(context);
break;
case "download-file": this.DownLoadFile(context);
break;
}
}
public void GetFileInfo(HttpContext context)
{
string fileid = string.IsNullOrEmpty(context.Request["fileid"]) ? "" : context.Request["fileid"].ToString();
List<object> list = new List<object>();
FileInfo file = new FileInfo();
using (DataContext dc = new DataContext(DbHelper.GetConStr))
{
file = dc.GetTable<FileInfo>().ToList().Where(p => p.FileId == fileid).FirstOrDefault();
}
if (file != null)
{
list.Add(file.FileName);
list.Add(Path.GetExtension(file.FileName));
list.Add(file.FileSize);
context.Session["filePath"] = file.FilePath;
}
context.Response.Write(JsonBase.Serialize<List<object>>(list));
}
public void DownLoadFile(HttpContext context)
{
DownLoad2.DownloadFile(context,context.Session["filePath"].ToString() , 1024 * 1024 * 10);
}
3.前台代码
<script type="text/javascript">
$(function () {
$("#btnDownLoad").click(function () {
$(this).jDownload({fileId:"003"});
$(this).trigger("down");
});
});
4.运行效果