ajax 加载数据前显示动画



在用ajax 异步刷新局部页面时，在数据载入之前先显示一个动画，提示数据正在加载，这个功能其实很简单，以下是用bootStrap 框架为例的，具体的实现步骤如下：

1.创建一个div

<div style="position: absolute; top: 50%; left: 50%; display: none;" id="loadgif">
    <img alt="加载中..." src="/Content/img/spinner.gif" />
    <!-- /.modal-dialog -->
</div>

在点击刷新或更新数据时，手动启动与关闭动画，js如下：

 开启:    $("#loadgif").modal("show");
 关闭：    $("#loadgif").modal("hide");

 效果如下：