我对 jQuery 完全陌生。我试图在所有页面内容准备好之前显示加载程序。
<script>
$(document).ready(function(){
$(document).ajaxStart(function(){
console.log('wait');
$("#wait").css("display", "block").show();
});
$(document).ajaxComplete(function(){
$("#wait").css("display", "none").hide();
});
});
在 body 里我有这个,
<div id="wait" style="display:none;position:absolute;top:20%;left:50%;"><img src="{{ asset('assets/global/img/ajax-loader.gif') }}" /></div>
但没有显示加载程序,并且控制台中没有显示错误。 谁能给我任何有关此问题的解决方案或示例?
提前致谢!
最佳答案
检查下面的演示代码。
$(document).ready(function(){
$('#loader').fadeOut(showBodyPart);
function showBodyPart(){
$('#body_parts').fadeIn(300);
}
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="loader">
<img src="http://i.imgur.com/KUJoe.gif" id="a" alt="Loading" />
Loading...
</div>
<div id="body_parts" style="display: none;">
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>
</div>
关于javascript - 页面加载 jquery 之前的页面预加载器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50151637/