在将记录保存到数据库中时，在屏幕上显示“正在保存...”动画

Question

据我所知，有两种可能的设计方法：

1. 使用gif文件。单击“保存”按钮后，它应在屏幕上显示“正在保存...”gif文件几秒钟（延迟是硬编码的），然后应该开始将记录保存到数据库的过程。理想情况下，这会降低性能，因为动画延迟+保存记录需要时间。

2. 多线程。保存记录和动画应该并行完成。我不知道如何做到这一点。

哪种可能？

请分享一些信息和代码片段。此外，发布任何其他可以解决此问题的想法。

先谢谢

Answer 1

使用此插件

jquery plugin message

Live Demo

Answer 2

我认为第一个更好.. 将下面的代码放在页面中，然后当按下按钮加载相应的div id。

        <div id="divLoading" class="loading-div">
            <img id="imgLoading" class="loading-img" src="images/loading.gif"" />
            <span>Just a moment...</span>
        </div>

Answer 3

第二个很容易做到：

使用JQUERY api，

有关详细信息：here

$.ajax({
  type: "POST",
  url: "some.php", // here server side saving code will be here.
  data: { name: "John", location: "Boston" }
}).done(function( msg ) {
  alert( "Data Saved: " + msg );
});

与此同时，你只需要显示像加载一样的GIF图像......然后保存它。