Question

我正在使用Ajax和JQuery。我用ajax发送数据到return.php（例如）.. 当ajax发送数据时，我想写入屏幕“loading ..”。

Answer 1

获得动画的好地方是here

然后确实像@royinamir所说，显示/隐藏动画。为动画添加ID。简短的例子（使用jQuery）：

<div id="laoding">
<p>Loading data</p>
</div>

CSS中的

：

#loading{
  display: none;
  background: url(images/icon_loading_ani.gif) no-repeat;//the url of your animated gif
  background-position: 0px center;
  min-height: 35px;
  padding: 5px 0 0 0;
}

并在jQuery中：

$.ajax({
        type: 'get',
        url: url,
        data: 'ajax=1,
        beforeSend: function () {
            $('#get_data').show();
        },
        success: function (data) {
            $('#filter').show();
// do some other stuff
        }
    });

Answer 2

纯粹实用术语通常情况（根据我的经验），Ajax请求的下载部分需要不到一秒的时间，因此我很难证明或多或少的精心进展酒吧或类似：用户无法从中学到很多东西。另外，每十分之一秒维护和更新进度条可能需要现在增加的下载时间的很大一部分。

但是用户肯定应该知道何时（以及为什么）他无法获得按钮按下的响应，因为下载正在进行中。在发出请求时，您可能需要考虑将小的（如24 x 24）彩色图像变黑;并在请求完成时恢复其颜色。更好的是，采取Dennis Hunink的建议来改变提交按钮的颜色。

但所有这些仅仅是实用性。制作进度条很有趣，在工作时欣赏它会更有趣。仅这一点就使这项工作变得有价值。

Answer 3

$("#loading_animation").bind({
    ajaxStart: function() { $(this).show(); },
    ajaxStop: function() { $(this).hide(); }
});

Answer 4

在这种情况下，您可以显示一个对话框 - “加载”，在ajax的回调中，您可以隐藏加载对话框。展示与展示隐藏对话框可以放在实用程序中，以便可以在其他地方使用。

使用ajax发送数据时，我想创建加载栏

4 个答案: