Question

我正在使用filestack进行单词计数器文件，我想在计算单词时显示加载，并在完成后隐藏它。

所以我在HTML中有这个：

<div id="loading" style="display:none;clear:both;">
<img src="loading.gif">
</div>
<input id="ff" type="filepicker" data-fp-apikey="<myAPI>" data-fp-mimetypes="image/*,application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" data-fp-container="modal" data-fp-multiple="true" data-fp-button-class="btn btn-primary l-align" data-fp-button-text="Upload" data-fp-services="SKYDRIVE,COMPUTER,URL,GOOGLE_DRIVE,GMAIL" data-fp-language="es">
<div id="result"></div>

在JS中我有这个：

$("document").ready(function(){

$("#ff").change(function(){

    var out='';
    for(var i=0;i<event.fpfiles.length;i++){
        var n = i+1;
        out+='<a target=_blank href=' + event.fpfiles[i].url + '>' + '<button type=button class=btn-sc2><i class=fa fa-file-text aria-hidden=true></i> ' + event.fpfiles[i].filename + '</button></a>';out+=' '

        if(event.fpfiles[i].mimetype=="image/jpeg"){

            $.post("filecount.php",{
                url: event.fpfiles[i].url
            }).done(function(response){
                //functions to count words
            });//post               

        } else if(event.fpfiles[i].mimetype=="application/msword"){

            var link = event.fpfiles[i].url;
            var idfile = link.substr(link.lastIndexOf("/")+1);
            var lcconvert = "https://process.filestackapi.com/output=format:txt/"+idfile;

            $("#dkd").load(lcconvert, function(){
                $.post("filecount2.php",{
                    url: $("#dkd").val()
                }).done(function(response){
                   //functions to count words
                });//post                   
            });
        }
    };//for
   $("#result").html(out);
});//#ff
});

我正试图把'$（“＃loading”）。show（）;'和'$（“＃loading”）。hide（）;'在帖子功能的任何部分，但它不起作用或只出现但在发布功能完成时不会隐藏。

我想要一些帮助。

Answer 1

无论何时进行任何Ajax调用，都会触发ajaxStart / Stop函数。

从jQuery 1.8开始，文档指出.ajaxStart/Stop只应附加到文档中。这会将上面的代码段转换为：

var $loading = $('#loadingDiv').hide();
$(document)
  .ajaxStart(function () {
    $loading.show();
  })
  .ajaxStop(function () {
    $loading.hide();
  });

在您的具体案例中：

$loading.show();
$.post("filecount.php",{
    url: event.fpfiles[i].url
}).success(function(response){
    //functions to count words
    $loading.hide();
});//post

在通话之前显示，并在成功功能或错误功能中隐藏它。

在for循环执行时显示加载，直到完成

1 个答案: