我試圖在加載數據表時顯示等待的gif。我只是在進入我的$(element).each()
循環之前調用$(element).show()
,該循環顯示使用數據表的所有子網格(即DisplayInnerTable()
)。在調用JQuery之前,不會顯示等待的gif。每個
看來我已經將問題縮小到.each()
方法。如果我刪除.each()
裏面的所有代碼,那麼wait gif仍然不會顯示,並且是的,我還刪除了.hide()
。如果我在.each()
之前放置了一箇中斷點,則會顯示wait gif。似乎是一個時間問題,如.each()
正在發生如此之快wait.gif
內div
沒有時間呈現。儘管如此,爲什麼Javascript線程會阻止HTML元素的操作呢?
我的確發現了一些類似的文章,但他們都沒有回答這個問題。大多數其他文章推薦使用setTimeout()
。以及我儘可能以各種方式嘗試過,沒有運氣。任何幫助,提示或線索將不勝感激。
這裏是我的代碼片段:
$(document).ready(function()
{
$('#expand-all').on('click', function() {
$("#loader-wait-ani").show();
ExpandAllChildGrids();
});
function ExpandAllChildGrids()
{
var tr;
$('#result-table tbody tr').each(function (value, index) {
tr = $(this).closest('tr');
var row = outerTable.row(tr);
userId = row.cell(tr, 1).data();
DisplayInnerTable(userId, row, tr);
});
$('#expand-all-img').attr('src', '/Images/minus.gif');
$("#loader-wait-ani").hide();
}
});
這裏是我的html:
<div style="width:100%; margin: 0 auto; text-align:center;">
<div id="loader-wait-ani" class="modal" style="display: none; z-index: 300;">
<img src="~/Images/waitbar.gif" alt="Pleae Wait..." width="250" height="20" />
</div>
</div>
你有多個ID =「裝載機-WAIT - ani「? – RIanGillis
你有沒有試過在'.show()'上使用回調函數? –
您在相同的代碼執行例程中顯示並隱藏加載gif。中間不會出現渲染。這就是爲什麼它不會出現。 DisplayInnerTable函數在內部做了什麼? DisplayInnerTable中是否有一些填充單元格的異步代碼? –