我如何添加预加载器来加载内容div jquery？

Question

[嗨，我有这个jQuery用按钮代码将内容加载到div中，但是您要加载的内容包括很多尺寸的图像，并希望在将其加载到div中时显示，因此会预先加载动画gif，这可能导致出来？

代码jquery：

function chargue(div, of)
{
$(div).load(of, function() {
});
}

按钮：

<a href="#next" onClick="chargue('#left','change.php')">CHANGE</a>

CSS div #left：

#left {
    width: 744px;
    float: left;
    height: 100%;
    position:relative;
}

Answer 1

您可以简单地将div的内容更改为动画加载gif，然后在ajax get()完成后，用结果替换div内容。

function chargue(div, of)
{
  //insert loading gif
  $(div).html('<img src="image/loading.gif">');

  //fetch larger images
  $.get(of, function(results) {
    $(div).html(results);
  });
}

Answer 2

function chargue(div, of)
{ 
    $('#loader').show();
    $(div).load(of, function(response, status, xhr) { 
      if(status == 'success'){ 
        $('#loader').hide();
      }
   });
}