MVC ActionResult調用文件下載時在mouseup上斷開圖像

我最初創建了一個按鈕，它根據mouseup和mousedown更改了src，使它在單擊時發出沮喪的聲音以及播放咔嗒聲。直到我試圖通過MVC操作強制下載PDF時，這纔算正常。我試圖用幾種不同的方法來修飾這隻貓，但是我已經決定使用mouseup函數來設置窗口位置，以便傳遞我所需的文件下載路徑信息。現在，當我點擊按鈕（正確執行mousedown）時，然後在mouseup上正確播放點擊聲音，並按需下載PDF文件，但使按鈕圖像看起來已損壞。MVC ActionResult調用文件下載時在mouseup上斷開圖像

當我第一次加載頁面，並沒有點擊按鈕，圖像看起來像它應該。然後在運行mouseup後它被破壞（使用Chrome或消失或在IE和Safari中出現亂碼），但是當我檢查源時，src屬性看起來是相同的，所以我不確定爲什麼它會返回一個破碎的圖像，如果src是相同的像以前一樣。

代碼 -

查看jQuery的：

var audio = document.getElementsByTagName("audio")[0]; 

    $('#MAAX-DGB-Button').mouseup(function() { 
     $(this).attr('src', '../../Content/Images/AdLandingViews/MAAX-DGB.png'); 
     audio.play(); 

     var pdfDownload = '/Locator/ForcePDFDownload?PDFURL=<file location info>'; 
     window.location = pdfDownload; 
    }); 
    $('#MAAX-DGB-Button').mousedown(function() { 
     $(this).attr('src', '../../Content/Images/AdLandingViews/MAAX-DGB_press.png'); 
    });

查看HTML：

<img src="../../Content/Images/AdLandingViews/MAAX-DGB.png" alt="Download MAAX Collection Brochure" id="MAAX-DGB-Button" />

ForcePDFDownload MVC操作：

public ActionResult ForcePDFDownload(string PDFURL) 
    { 
     string path = @"\\<server location>\" + PDFURL; 
     string filename = Path.GetFileName(PDFURL); 
     Response.AppendHeader("Content-Disposition", "attachment; filename=" + filename); 
     return File(path, "application/pdf"); 
    }

你可以在這裏測試代碼： https://maaxspasportal.com/Locator/AdLandingLocate/MAAXCollection，但您必須填寫一些虛擬數據並提交表單才能進入在「下載綠色小冊子」按鈕上發生此問題的結果頁面。

測試過的瀏覽器：

Chrome版本28.0.1500.95 - 圖像顯示中斷。

IE 10 - 圖像消失或看起來亂碼。

Safari 6.0.5 - 圖像消失。

FireFox 22.0 - Works！

感謝您的任何幫助，使其正常工作。

來源

2013-08-22 Alec Menconi

嗯，我從來沒有確定問題的確切根本原因，但我確實找到了解決問題的方法。

在鼠標鬆開我申請的強制PDF下載功能的setTimeout延遲：

var audio = document.getElementsByTagName("audio")[0]; 

    $('#MAAX-DGB-Button').mouseup(function() { 
     $(this).attr('src', '../../Content/Images/AdLandingViews/MAAX-DGB.png'); 
     audio.play(); 

     var pdfDownload = '/Locator/ForcePDFDownload?PDFURL=assets.maaxspas.com/docsources/1/138ee0a8-e0f0-47d5-9447-fca6f538d74f.pdf'; 
     setTimeout(function() { window.location = pdfDownload }, 1000); 
    }); 
    $('#MAAX-DGB-Button').mousedown(function() { 
     $(this).attr('src', '../../Content/Images/AdLandingViews/MAAX-DGB_press.png'); 
    });

會不會讓有興趣知道發生了什麼事情不對，但至少它的運作我現在想要的方式。

謝謝。

來源

2013-08-23 16:08:38

MVC ActionResult調用文件下載時在mouseup上斷開圖像

回答

相關問題