使用jQuery下载文件

时间:2009-08-18 19:48:01

标签: jquery file download

如何在用户点击链接时提示下载。

例如,而不是:

<a href="uploads/file.doc">Download Here</a>

我可以使用:

<a href="#">Download Here</a>

 $('a').click... //Some jquery to download the file

这样,Google就不会将我的HREF和私人文件编入索引。

这可以用jQuery完成,如果是这样,怎么做?或者应该用PHP或其他东西来完成?

11 个答案:

答案 0 :(得分:153)

我可能会建议使用preventDefault

作为一种更优雅的降级解决方案
$('a').click(function(e) {
    e.preventDefault();  //stop the browser from following
    window.location.href = 'uploads/file.doc';
});

<a href="no-script.html">Download now!</a>

即使没有Javascript,至少这样用户也会获得一些反馈。

答案 1 :(得分:22)

如果您不希望搜索引擎为某些文件编制索引,您可以使用robots.txt告知网络蜘蛛不要访问您网站的某些部分。

如果您只依赖于javascript,那么一些没有它的用​​户将无法点击您的链接。

答案 2 :(得分:18)

这是一篇很好的文章,展示了从搜索引擎中隐藏文件的许多方法:

  

http://antezeta.com/news/avoid-search-engine-indexing

JavaScript不是索引页面的好方法;它不会阻止用户直接链接到您的文件(并因此将其显示给抓取工具),并且正如Rob提到的那样,并不适用于所有用户。
一个简单的解决方法是添加rel="nofollow"属性,但是如果没有robots.txt,它就不完整。

<a href="uploads/file.doc" rel="nofollow">Download Here</a>

答案 3 :(得分:11)

是的,您必须将window.location.href更改为您要下载的文件的网址。

window.location.href = 'http://www.com/path/to/file';

答案 4 :(得分:8)

 var link=document.createElement('a');
 document.body.appendChild(link);
 link.href=url;
 link.click();

答案 5 :(得分:6)

通过声明window.location.href = 'uploads/file.doc';,您可以显示存储文件的位置。您当然可以使用.htacess来强制存储文件所需的行为,但这可能并不总是很少....

最好创建服务器端php文件并将其放入其中:

header('Content-Type: application/octet-stream');
header('Content-Disposition: attachment; filename='.$_REQUEST['f']);
readfile('../some_folder/some_subfolder/'.$_REQUEST['f']); 
exit;

此代码将作为下载文件返回任何文件,而不显示您实际存储的位置。

您可以通过window.location.href = 'scripts/this_php_file.php?f=downloaded_file';

打开此php文件

答案 6 :(得分:3)

Hidden iframes可以提供帮助

答案 7 :(得分:3)

  • 使用jQuery函数

        var valFileDownloadPath = 'http//:'+'your url';
    
       window.open(valFileDownloadPath , '_blank');
    

答案 8 :(得分:2)

我建议您使用mousedown事件,该事件在click事件之前调用。 这样,浏览器自然地处理click事件,这避免了任何代码怪异:

(function ($) {


    // with this solution, the browser handles the download link naturally (tested in chrome and firefox)
    $(document).ready(function () {

        var url = '/private/downloads/myfile123.pdf';
        $("a").on('mousedown', function () {
            $(this).attr("href", url);
        });

    });
})(jQuery);

答案 9 :(得分:0)

有关使用jQuery清除表单的类似帖子,请参阅此处:Resetting a multi-stage form with jQuery

您可能还遇到了struts值堆栈重新填充值的问题。换句话说,您提交表单,在操作类中执行任何操作,但不清除操作类中的相关字段值。在这种情况下,表单似乎会保留您先前提交的值。如果你以某种方式持久化这些,只需在持久化之后和返回SUCCESS之前将动作类中的每个字段值都为空。

答案 10 :(得分:0)

你可以很容易地用 html5 做到这一点:

var link = document.createElement('a');
link.href = "/WWW/test.pdf";
link.download = "file_" + new Date() + ".pdf";
link.click();
link.remove();