0

在编程方面我很新，所以也许这对你们来说是在公园里散步。我想创建一个带有进度条的 .gif 图像的 div，其中 div 仅应在按下按钮时显示，例如将一些设置保存到数据库中。

此功能将在 GUI 中的任何地方使用，并且每次对数据库进行查询时。我正在使用 jQuery UI 进行编码，并且有人建议我使用 ajaxStart() 和 ajaxStop()，但不太清楚如何正确使用它。下面的代码只是我写的一些代码，我认为我会以某种方式走上正确的轨道，但很可能不是。

- - - 脚本 - - -

$(document).ready(function(){
      $("#progressContainer").ajaxStart(function(){
        $(this).html("<img src='ajax-progressbar.gif' />");
      });
      $(".clickForProgressBar").click(function(){
        $("#progressContainer").load("");
      });
    });

----- HTML -----

<button class="clickForProgressBar">Click here</button>
<div id="progressContainer"></div>

如果有人可以尝试给我一些关于如何进行的提示，我将永远感激不尽。如果你能理解我的意思；）

4

1 回答 1

1

这是一种方法的概述。

首先，因为这是一个应用程序范围的策略，所以创建一个 Ajax 包装器并将该包装器用于所有调用。

接下来，在包装器中，在向服务器发出实际调用之前显示图像。

最后，当调用返回时（出于任何原因），在继续之前隐藏图像。

要记住的一个问题是您希望如何处理图像容器。例如，如果它将位于 div 标签中（正如您在上面指出的），您可能希望将 div 标签的 id 作为调用的一部分传递，以确保不同的 div 标签或展示位置仍然有效。或者，您可以使用在内容上弹出并显示图像的模式窗口。这将使您不必使用 div 标记，并且无需对页面布局做出任何假设，尽管它可能更加突兀（这可能是一件好事，具体取决于您在做什么）。

于 2012-12-21T13:38:35.247 回答