Question

我尝试在Click事件上实现一个函数，下载文件，然后在文件下载完成后关闭UI对话框。问题是，$preparingFileModal.dialog({ modal: true })之后代码不再触发，successCallback无法检测到文件下载结束。

$(function () {
    $(document).on("click", "a.fileDownloadCustomRichExperience", function () {

        var $preparingFileModal = $("#preparing-file-modal");

        $preparingFileModal.dialog({ modal: true });

        $.fileDownload($(this).prop('href'), {
            successCallback: function (url) {

                $preparingFileModal.dialog('close');
            },
            failCallback: function (responseHtml, url) {

                $preparingFileModal.dialog('close');
                $("#error-modal").dialog({ modal: true });
            }
        });
        return false; //this is critical to stop the click event which will trigger a normal file download!
    });
});

<div id="preparing-file-modal" title="Preparing report..." style="display: none;">
    We are preparing your report, please wait...

    <div class="ui-progressbar-value ui-corner-left ui-corner-right" style="width: 100%; height:22px; margin-top: 20px;"></div>
</div>

<div id="error-modal" title="Error" style="display: none;">
    There was a problem generating your report, please try again.
</div>

Answer 1

查看Jquery File download ($.fileDownload)

您需要设置标题<!DOCTYPE html> <html> <head> <title>Video Player</title> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <style> @-ms-viewport { width: 100vw ; zoom: 100% ; } @viewport { width: 100vw ; zoom: 100% ; } @-ms-viewport { user-zoom: fixed ; } @viewport { user-zoom: fixed ; } </style> <script src="lib/ft/fastclick.js"></script> <link rel="stylesheet" href="css/app.css"> </head> <body> <button onclick="playVideo();">Play Video</button> <script src="intelxdk.js"></script> <script src="cordova.js"></script> <script src="xhr.js"></script> <script src="js/app.js"></script> <script src="js/init-app.js"></script> <script src="js/init-dev.js"></script> <script> function playVideo() { //this function launches default video player and plays the video.mp4 file. intel.xdk.player.playPodcast("http://labs.qnimate.com/video.mp4"); } document.addEventListener("intel.xdk.player.podcast.start", function(){ //started playing video alert("start"); }, false); document.addEventListener("intel.xdk.player.podcast.stop", function(){ //video finished or player closed alert("stop"); }, false); document.addEventListener("intel.xdk.player.podcast.error", function(){ //error occured therefore video cannot be played alert("error"); }, false); document.addEventListener("intel.xdk.player.podcast.busy", function(){ //another video is already being played alert("busy"); }, false); </script> </body> </html>

"Set-Cookie: fileDownload=true; path=/"就是我在PHP中的表现。当用户点击下载按钮时，我开始压缩一些文件。创建zip文件后，我设置上面的标题并将zip文件路径回显到浏览器并通过jqueryFileDownload开始下载。

header("Set-Cookie: fileDownload=true; path=/");

Answer 2

如果您使用的是 HapiJS版本> = 15 ，则还需要指定 isSecure 和 isHTTPOnly 标志

reply.state("fileDownload", "true", { path: "/" , isSecure: false, isHttpOnly: false })

Answer 3

please try like this

function exportToExcelTest() {
        var region = $('#ddlRegion').val();
        var hrinfo = $('#hrinfodropdown').val();
        if (region != null) {
            $('#ExportOptions').modal('hide');
            $.blockUI({ message: '<h1>Please wait generating excel data...</h1>' });
            //$.blockUI({ message: '<h1><img src="../Images/ajax_loader_blue_350.gif" /> Just a moment...</h1>' });
            $.blockUI({ css: { backgroundColor: '#f00', color: '#fff'} });
            var myData = region + ':' + hrinfo;

            $.fileDownload('Excel.ashx', {
                httpMethod: "POST",
                data: { data: myData },
                successCallback: function (url) {
                    //$("div#loading").hide();
                    //alert('ok');
                    //response.setHeader("Set-Cookie", "fileDownload=false; path=/");
                    $.unblockUI();
                },
                prepareCallback: function (url) {
                    //alert('ok');
                    //response.setHeader("Set-Cookie", "fileDownload=true; path=/");
                    $.unblockUI();
                },
                failCallback: function (responseHtml, url) {
                    //alert('ok');
                    // $("div#loading").hide();
                    // alert('Error while generating excel file');
                    //response.setHeader("Set-Cookie", "fileDownload=false; path=/");
                    $.unblockUI();
                }
            });          
        }
        else {
            alert('Please select a region....');
            return false;
        }
    }

Referance from : https://www.experts-exchange.com/questions/28713105/Jquery-fileDownload-successcallback-not-working.html

中加密

我希望它对你有用..

Jquery FileDownload不会触发successCallback事件

3 个答案: