在 javascript 中实现加载旋转轮

Question

在我的网站中，我需要在单击按钮时弹出一个虚拟的“加载”纺车，并在一段时间后消失。这只是一个虚拟页面。如果有人能解释如何做这样的事情，我将不胜感激。我可以用 javascript 或 jQuery 做到这一点吗？

提前谢谢

Answer 1

在您需要的正确位置放置一个 div/图像，第一次加载页面时将其隐藏。喜欢

<input type="button" id="button"/>
  <div id="load"><img src="http://jimpunk.net/Loading/wp-content/uploads/loading1.gif"/>
</div>

并在您的 jquery 中，为按钮的单击事件设置一个处理程序以显示或隐藏 div

$(document).ready(function(){
  $('#button').click(function(){
    $('#load').show();
    setTimeout(function() {$('#load').hide()}, 2000);
  });
});

setTimout 可用于在一段时间后隐藏 div。在此处检查工作示例