如何让 JQuery 在继续使用 MVC Core 之前等待完成一段代码

Question

我希望用户按下下载按钮。该按钮将调用一个 JQuery 函数，该函数将启动加载模式，运行 Url.Action 请求，然后在操作完成运行后立即停止模式。不幸的是，JS 启动然后停止我的模态，即使它还没有完成运行我的 Url.Action

代码：

$('#DownloadBtn').click(function () {
    var modal = document.getElementById("myModal");
    modal.style.display = "block"; // starts the loading modal display when button is pressed

    location.href = '@Url.Action("Download", "Home")'; //action to download begins (this usually takes around 10 seconds to run through, that's why I want that modal running until the action is finished)

    modal.style.display = "none"; //this switches to none before the above Action has even completed
}

Answer 1

您可以像这样使用 setTimeout 来延迟模式关闭

$('#DownloadBtn').click(function () {
    var modal = document.getElementById("myModal");
    modal.style.display = "block";
    location.href = '@Url.Action("Download", "Home")';
    
    setTimeout(() => {
        modal.style.display = "none"
    }, 10000); // Delay in ms
}

等待@Url.Action 完成将是理想的解决方案，但我什至找不到任何相关信息。

Answer 2

您可以使用 AJAX（异步 JavaScript 和 XML）

我建议你读一读

https://www.w3schools.com/js/js_ajax_intro.asp

然后带着问题回来。

有很多方法可以使用 AJAX。您可以忽略不需要的 XML 部分。

w3schools 文章说明了在没有框架的情况下使用 AJAX，即 vanilla javascript。但是您可以使用 JQuery (https://api.jquery.com/jquery.ajax/) 和其他框架来实现相同的目标，而无需了解细节，尽管仍有学习曲线。我不为此使用框架，vanilla JS 完美且占用空间小。

我会发布代码，但我不断收到格式错误，抱歉。