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

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

我想在页面等待时向用户显示一些内容

这大约需要5-6秒，所以我想在它等待的时候展示一个旋转器或盒子

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

---

在页面中添加隐藏的加载图像，在启动函数时显示，在函数完成时再次隐藏

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


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

函数（）{
$（“#加载”）.show（）；
你的逻辑
$（“#加载”）.hide（）；
}

这只是我想到的第一件事。可能不是最好的解决方案。但是它起作用了。。默认情况下，您可以定义加载div并将其隐藏。然后，当each正在做它的事情时，显示loading div。例如：

CSS:

HTML:

---

这可能有助于AJAX逻辑：

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

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

---

看看这个问题是否有用：完全取决于你在等待什么。。看起来您正在运行一些脚本。。这将冻结你的浏览器，直到脚本完成。完全没有用，如果你这样做，它只是隐藏了imginstantly@Barbz_YHOOL这就是它的目的：/

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

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

                    });
            }

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

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

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

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

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