Question

我正在尝试在Ajax调用期间显示gif;如果div处于主体级别但不会出现在选项卡面板中，它可以正常工作。我已经尝试将div放在选项卡窗格，容器，行和列级别，但它不会显示。简单的html：

 <div id="loading">
     <img id="loading-image" src="images/page-loader.gif" alt="waiting..." />
 </div>

jquery的：

$('#loading').hide(); $('#loading').show(); // as required

的CSS：

#loading {
 width: 100%;
 height: 100%;
 top: 0px;
 left: 0px;
 position: fixed;
 display: block;
 opacity: 0.7;
 background-color: #fff;
 z-index: 99;
 text-align: center;
}

#loading-image {
 position: absolute;
 top: 10px;
 left: 24px;
 z-index: 100;
}

Answer 1

试试这个：

$(document).ajaxStart(function() {
    $('<div id="loading"><img id="loading-image" src="images/page-loader.gif" alt="waiting..." /></img></div>')
.prependTo('.tabClass'); });

$(document).ajaxStop(function() {
    $('#loading').remove();
});

将'tabClass'替换为您希望gif动画附加到的任何容器的类。

我发现这个解决方案更清洁＆amp;工作得很好。

ajax在选项卡面板中加载gif

1 个答案: