jQuery 从一个按钮下载一个 zipfile?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2878585/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 14:28:16  来源:igfitidea点击:

jQuery download a zipfile from a button?

jquerybuttonzipfile

提问by FFish

Quite embarrassing how much time I spend trying to get to download a zipfile from a button....

很尴尬,我花了多少时间试图从按钮下载 zip 文件......

<button type='button' id='button-download'>download zipfile</button>


$("#button-download").live("click", function() {
    $.get("http://localhost/admin/zip/002140.zip"); // doesn't work?
})

I need something bullet proof here, that's why I ask here, thanks.

我需要一些防弹的东西,这就是我在这里问的原因,谢谢。

采纳答案by bobince

Use a plain:

使用普通:

<a href="http://localhost/admin/zip/002140.zip" id="button-download">download zipfile</a>

link. Then it'll work fine (“bullet proof” even) without JavaScript available. It also offers more of the traditional affordances users might expect from a download link, such as right-click-save-as, or drag-and-drop.

关联。然后它会在没有 JavaScript 可用的情况下正常工作(甚至“防弹”)。它还提供了用户可能期望从下载链接获得的更多传统功能,例如右键单击另存为或拖放。

You can of course use CSS to make it look like a button instead of a link. But what it actuallyis, is a link. So that's how it should be marked up.

您当然可以使用 CSS 使其看起来像一个按钮而不是一个链接。但它实际上是一个链接。所以这就是它应该被标记的方式。

回答by CMS

You should set the location.hrefproperty to cause navigation:

您应该设置该location.href属性以进行导航:

$("#button-download").live("click", function() {
  location.href = "http://localhost/admin/zip/002140.zip";
});

You could also have a simple <a>element, styled as if it were a button, in that way even the users who have JavaScript disabled will be able to download the file.

你也可以有一个简单的<a>元素,样式就像一个按钮,这样即使禁用了 JavaScript 的用户也可以下载文件。

回答by Kerry Jones

That is sending an AJAX request.

即发送 AJAX 请求。

I haven't tried this, but it should work in theory. If you try to go to a location of a file that is downloaded, it prompts you to download rather than take you to that page.

我没有试过这个,但理论上应该可以。如果您尝试转到已下载文件的某个位置,它会提示您下载而不是将您带到该页面。

<button type='button' id='button-download'>download zipfile</button>


$("#button-download").live("click", function() {
    window.location = "http://localhost/admin/zip/002140.zip";
})

回答by TheCarver

Bit late to the party but thought I'd share my solution as nobody else has.

参加聚会有点晚,但我想我会像其他人一样分享我的解决方案。

You can have the best of both worlds; a simple HTML link and a JS function, without losing the non-JS users.

你可以两全其美;一个简单的 HTML 链接和一个 JS 函数,不会丢失非 JS 用户。

<a id="download" href="http://www.example.com/download.zip">Download</a>

$("#download").on("click", function(e) {

    // cancel the link's original functionality
    e.preventDefault();

    // do something before downloading
    alert("Thanks for downloading!");

    // download file
    location.href = "http://www.example.com/download.zip";

});