【问题标题】:JavaScript: How to download a file, then force a page reload?JavaScript:如何下载文件,然后强制页面重新加载?
【发布时间】:2012-12-05 23:37:54
【问题描述】:

正如标题所提到的,我正在尝试通过 href URL 给出的 PHP 脚本下载一个与关联的 mime 类型一起提供的文件,然后重新加载同一页面,但无法弄清楚,这就是我所拥有的远:

<a id="viewAttachmentLink" href="/path/to/script.php?id=123">View Attachment</a>

<script type='text/javascript'>
    jquery('#viewAttachmentLink').bind('click', function() {
        if (myFunction()) {
            window.location.href = "jquery(this).attr('href')";
            setTimeout(location.reload(), 400);
        } else {
            return false;
        }
    });
</script>

使用此代码,它将重新加载页面,但似乎没有调用 PHP 脚本。

【问题讨论】:

  • 下载文件是什么意思?您是要加载资源以在浏览器中执行某些操作还是将文件下载到用户的计算机?将href设置为字符串的行是错字吗?
  • 一些奇怪的事情: 1. 什么是myFunction()? 2. 应该是window.location.href = $(this).attr('href'); 3. 当你已经将href 设置为别的东西时,为什么还需要reload()
  • @AndrewHubbs:下载文件,然后重新加载页面。
  • @BrianCray:MyFunction 只是一个占位符调用,表示我正在调用另一个将返回 true/false 的函数。不想添加所有代码,因为它与问题无关。
  • 我能够通过在链接定义中添加“target=_new”来解决这种情况。现在,当单击链接时,下载将强制打开一个新窗口,远程 php 脚本将在其中指示标题内容等。然后浏览器下载文件并关闭窗口,然后重新加载主窗口。如果有人有更优雅的解决方案,我会保持开放状态。

标签: javascript jquery


【解决方案1】:

正如 cmets 中所述,我可以通过在链接中添加 target="_new" 属性来解决此问题。因此,当点击链接时,它会将远程 php 脚本的请求发送到另一个窗口,该窗口将控制标题并开始下载文件,并且原始窗口将根据需要重新加载。

【讨论】:

    【解决方案2】:

    我进行了文件下载和状态更新(通过标题),如下所示:

    <a id="downloadData">Download data...</a>
    
    <script type="text/javascript">
        $('#downloadData').on('click', function () {
            $.ajax({
                url: '/data',
                method: 'GET',
                success: function (data, textStatus, request) {
                    var output = request.getResponseHeader('output');
                    //refresh page here and use the output
                    //console.log(output);
                    var a = document.createElement('a');
                    var url = '/data';
                    a.href = url;
                    a.click();
                    //save file
                },
                error: function (e) {
                    console.log(e);
                }
            });
        });
    </script>
    

    【讨论】:

      猜你喜欢
      • 2016-02-11
      • 1970-01-01
      • 2012-03-26
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-03-02
      相关资源
      最近更新 更多