jQuery fileDownload 插件不显示弹出窗口，如何解决这个问题？答案

【问题标题】：jQuery fileDownload plugin doesn't show popup window, how to fix this?jQuery fileDownload 插件不显示弹出窗口，如何解决这个问题？
【发布时间】：2023-03-03 06:40:19
【问题描述】：

我将 jQuery 用于应用程序的前端部分（后端在 Flask 上运行），我需要一个插件来在用户等待文件提供给他时向他显示某种信息（我还需要使用旧版本的 IE，这就是为什么我决定使用this plugin)。

不幸的是，由于我遇到了一些奇怪的 JS 错误（屏幕和下面的示例代码），我无法用它做任何事情。

示例服务器端代码：

from flask import Flask, send_file, render_template
import os
from time import sleep

app = Flask(__name__)

@app.route('/', methods=['GET'])
def mainRoute():
    return render_template('index.html')

@app.route('/filesfordl/file.txt', methods=['GET'])
def fileRoute():
    sleep(5) # time for window to appear
    fileResponse = send_file(os.path.join(os.getcwd(), 'filesfordl/file.txt'), as_attachment=True, attachment_filename='file.txt')
    fileResponse.set_cookie('fileDownload', 'true')
    return fileResponse

if __name__ == '__main__':
    app.run('0.0.0.0', '5000')

我的 index.html：

<html>
    <head>
            <script type="text/javascript" src="{{ url_for('static', filename='js/jquery-3.3.1.min.js') }}"></script>
            <script type="text/javascript" src="{{ url_for('static', filename='js/jquery.fileDownload.js') }}"></script>
            <script type="text/javascript" src="{{ url_for('static', filename='js/script.js') }}"></script>
    </head>


<body>
    <a href="/filesfordl/file.txt" class="fileDownloadSimpleRichExperience">Get file!</a>
</body>
</html>

最后是 JS 部分：

/*$.fileDownload('/filesfordl/file.txt', {
    successCallback: function (url) {

        alert('You just got a file download dialog or ribbon for this URL :' + url);
    },
    failCallback: function (html, url) {

        alert('Your file download just failed for this URL:' + url + '\r\n' +
                'Here was the resulting error HTML: \r\n' + html
                );
    }
});
*/

$(function() {
    $(document).on("click", "a.fileDownloadSimpleRichExperience", function() {
        $.fileDownload($(this).attr('href'), {
            preparingMessageHtml: "We are preparing your report, please wait...",
            failMessageHtml: "There was a problem generating your report, please try again."
        });
        return false; //this is critical to stop the click event which will trigger a normal file download!
    });
});

^^ 这部分如果我把上面的代码去掉注释，即使我不点击链接，进入index.html后总会触发failCallback。

单击超链接后，我收到此错误消息（还不能直接发布图片）： this 这最终导致插件代码中的这一行。 this

编辑：

我在有问题的行的顶部添加了一些调试打印：

console.log($("<div>").html(settings.preparingMessageHtml).dialog);
console.log($("<div>").html(settings.preparingMessageHtml));

我在is 之后得到了输出。关于我做错了什么有什么想法吗？

【问题讨论】：

标签： javascript jquery jquery-ui jquery-plugins

【解决方案1】：

好吧，没关系，我只是忘记包含 jQuery UI 文件，这是我的问题的唯一原因，主题可以关闭。

【讨论】：