我正在研究我们的 ASP.Net MVC 页面内容跳转到位的问题。
如果我在其中一个 .js 文件中放置一个调试点,我可以看到该页面已经渲染到其初始位置,然后 .js 文件执行其操作,并且页面重新绘制到正确的状态。这种情况发生得很快,但速度很慢,可以看到屏幕上的跳跃。
我可以停止页面渲染直到一切完成吗? 不太擅长这类事情,因此任何建议将不胜感激。
最佳答案
我不确定我是否理解那里发生的事情。 您可以尝试使页面最顶层的容器元素不可见,直到脚本完成。
在 CSS 文件中,只需将 display: none
CSS 属性分配给容器,或者更好的是,以内联样式将其分配给元素,如下所示:
<body>
<div class="body invisible" style="display: none;">
Your content
</div>
<script type="text/javascript">
$("div.body").removeClass("invisible"); //in case JS is present, don't reveal the element until scripts execute.
</script>
<style type="text/css">
div.invisible {display: block !important;} /*In case no JS support present, reveal the content after page fully loads*/
</style>
</body>
然后在JS中做这样的事情:
/*Your big JS code*/
$("div.body").css("display", "block"); //sets it visible again after code finishes
您甚至可以在此期间在页面上放置一个Loading
gif 图像。只需放置一个带有该背景图像的可见容器,当使主体可见时,使该图像不可见。
还有,另一种可能的解决方案可供尝试(不确定浏览器兼容性):http://bytes.com/topic/javascript/answers/738083-how-suspend-layout
但似乎这里接受了一个较差的解决方案:Suspend layout during DOM interaction
关于jquery - ASP.net MVC - 停止页面渲染直到 JQuery 完成,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3404397/