当动态更改 div 中的内容时,有没有办法延迟新内容的显示,直到所有布局完成?
我正在使用 javascript 和 ajax 来更新 div 的内容,当我插入 ajax 脚本返回的 html 时,它似乎在元素可见后对新内容进行布局,溢出目标 div
虽然这种情况发生得很快,而且最终结果也正是我希望的那样,但它确实会产生令人不快的“闪烁”,我想避免这种情况
JavaScript
$requestURL = 'Scripts/getCategoryItems.php?Category='+$category+'&PageLength='+$pageLength+'&Page='+$page ;
AjaxRequest.open('GET',$requestURL,true);
AjaxRequest.onreadystatechange = function()
{ if(AjaxRequest.readyState == 4)
{
if (AjaxRequest.responseText !== 'false')
{ TargetContainer.style.display = "none";
TargetContainer.innerHTML=AjaxRequest.responseText;
TargetContainer.style.display = "block";
} else { alert(AjaxRequest.responseText); } ;
document.body.className = '';
}
};
document.body.className = 'waiting';
AjaxRequest.send();
HTML:
<div id="Content" style="float:left; width:820px; height:550px; max-height:550px; color:#E0E0E0; padding-top:30px; overflow:hidden;"></div>
最佳答案
您可以在准备就绪的文档中运行您的代码,以便在开始进行 ajax 调用之前完全加载文档。
编辑:或者,如果您不使用 jQuery,则使用 window.onload 事件。
关于javascript - 延迟显示新内容直到布局完成,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33362615/