beforeunload 事件和 Content-Disposition=attachment

Question

我最近在我的代碼中添加了這樣的內容：

$(window).on('beforeunload', function () {
    $('.whirly-loader').show(); //SPINER
})

因此，只要用戶 go 到我的 web 的另一側，微調器就會出現。 它在大多數情況下都有效。 但是，在應用程序的某些部分，客戶端開始轉到另一端，服務器使用此標頭響應：

Cache-Control
    max-age=0, must-revalidate, private
Connection
    Keep-Alive
Content-Disposition
    attachment;filename=suministro.csv
Content-Type
    text/csv; charset=utf-8
[...]

這可以防止重新加載頁面，並且只顯示 window 以要求下載或打開文檔。 我的問題是即使頁面停止加載，微調器仍然顯示

即使頁面由於標題而沒有重新加載，應該隱藏我的微調器的事件是什么？

Answer 1

您可以為下載鏈接添加屬性目標。

例子：

<body onbeforeunload="document.body.style.backgroundColor = 'red';">
    <a href="output.zip" target="_blank">Download</a>
</body>

屬性target="_blank"將導致 onbeforeload 事件不會觸發。

Answer 2

我們遇到了類似的問題，並找到了手動執行魔術（在您的情況下，顯示微調器）的解決方案，例如：

 $('.js-show-spinner').addEventListener('click', event => { event.preventDefault(); $('.whirly-loader').show(); //SPINER });

 <a href="https://google.com">google.com</a> <a class="js-show-spinner" href="/home">Home</a> <a href="SOME_DOC" download>some doc</a>

Answer 3

這個 jquery 插件使用 window object 將它的 beforeunload 事件綁定到 body 元素，使其易於實現並提供通用解決方案。

 ;(function($, window, document){ $.fn.plgn = function() { //Start the loader when the event beforeunload $(window).bind('beforeunload', function(event){ event.stopPropagation(); console.log("whirly-loader show"); //Hide the loader after 5 seconds if the page fails to load setTimeout(function(){ console.log("whirly-loader hide"); }, 5000); }); } })(jQuery, window, document); //Start the loader as soon as javascript loads console.log("whirly-loader show"); $( document ).ready(function() { //Hide the loader when the page is completely loaded console.log("whirly-loader hide"); $("body").plgn(); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="button" value = "Refresh page" onclick="history.go(0)" />

beforeunload 事件和 Content-Disposition=attachment

問題描述

3 個解決方案

解決方案1
0 2021-12-17 08:21:54

解決方案2
0 2021-12-20 07:59:23

解決方案3
0 2021-12-21 09:45:39

beforeunload 事件和 Content-Disposition=attachment

問題描述

3 個解決方案

解決方案1 0 2021-12-17 08:21:54

解決方案2 0 2021-12-20 07:59:23

解決方案3 0 2021-12-21 09:45:39

解決方案1
0 2021-12-17 08:21:54

解決方案2
0 2021-12-20 07:59:23

解決方案3
0 2021-12-21 09:45:39