Question

有没有办法在我的javascript运行时显示加载微调器？

我希望在页面等待时向用户显示某些内容.....

这需要大约5-6秒。所以我想在等待时显示一个微调器或盒子

$.each(ARRAY, function(key, item){
                            //IM DOING SOME LOGIC HERE
                        });

Answer 1

在页面中添加隐藏的加载图像，在启动功能时显示它，并在功能完成时再次隐藏它。

<img src="loading image " id="loading">


function(){
  $("#loading").show();
  your logic
  $("#loading").hide();
}

Answer 2

这是我想到的第一件事。可能不是最好的解决方案。但它完成了这项工作..你可以定义一个加载div并默认隐藏它。然后，当每个人都在做它的事情时，显示加载div。如下所示：

CSS：

   .hidden{display:none;}

HTML：

      <div class="loading hidden"></div>

JavaScript的：

           function(){
               $('.loading').removeClass('hidden'); 
               $.each(ARRAY, function(key, item){

                    });
            }

Answer 3

这可能对AJAX逻辑有用：

<img id="loadingImg" src="loding.gif"/>

$('#loadingImg')
    .hide()  // hide it initially
    .ajaxStart(function() {
        $(this).show();
    })
    .ajaxStop(function() {
        $(this).hide();
    })
;

只要进行任何AJAX调用并显示加载微调器，就会触发ajaxStart / ajaxStop函数。

或者，这也可能有用：

function doLogic() {
    $('#loadingImg').show();

    setTimeout(function() { // allow spinner to load before work starts
        // logic here
    },500);

    $('#loadingImg').hide();
}

jquery在JS运行时加载微调器或加载消息

3 个答案: