Javascript 当MVC ActionResult调用文件下载时，鼠标上的图像被破坏

我最初创建了一个按钮，它根据mouseup和mousedown更改了src，使其在单击时看起来像被按下一样，并播放单击声音。在我尝试通过MVC操作强制下载PDF之前，这一切都很顺利。我尝试了几种不同的方法来剥这只猫的皮，但我决定使用mouseup函数将窗口位置设置为我的pdf下载操作，并传递所需的文件下载路径信息。现在，当我单击它按下的按钮时（正确执行mousedown），然后在mouseup上，它正确地播放单击声音，并根据我的需要下载pdf文件，但会使按钮图像看起来被破坏

当我第一次加载页面时，按钮还没有被点击，图像看起来就像应该的那样。然后在运行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');
    });

var audio=document.getElementsByTagName（“音频”）[0]；
$（“#MAAX DGB按钮”）.mouseup（函数（）{
$（this.attr（'src'，'../../Content/Images/AdLandingViews/MAAX-DGB.png'）；
音频播放（）；
变量pdfDownload='/Locator/ForcePDFDownload？PDFURL='；
window.location=pdfDownload；
});
$（“#MAAX DGB按钮”）.mousedown（函数（）{
$（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");
    }

public ActionResult ForcePDFDownload（字符串PDFURL）
{
字符串路径=@“\\\”+PDFURL；
字符串文件名=Path.GetFileName（PDFURL）；
Response.AppendHeader（“内容处置”、“附件；文件名=“+filename”）；
返回文件（路径“application/pdf”）；
}

您可以在此处测试代码： 但您必须填写一些虚拟数据并提交表单，才能进入结果页面，在该页面的“下载绿色宣传册”按钮上出现此问题

已测试的浏览器：

Chrome版本28.0.1500.95-图像显示已损坏

IE 10-图像消失或看起来乱七八糟

Safari 6.0.5-图像消失

Firefox22.0-工作正常

---

感谢您的帮助，使其正常工作。

我从未确定问题的确切根源，但我确实找到了解决问题的方法

在mouseup上，我对强制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');
    });

我仍然有兴趣知道出了什么问题，但至少它现在的运行方式是我想要的

谢谢