仅加载图像动画一次

时间:2015-06-11 14:13:39

标签: javascript kendo-ui kendo-chart

我有以下实现,它功能齐全。我需要首次显示加载动画图像,我当前的实现它始终显示加载动画。

 var theDataSource = new kendo.data.DataSource({
        transport: {
             read: function (op) {
                 setTimeout(function () {
                     op.success(data);
                 }, 4000);
             }
        },
        group: {
            field: "series"
        },
        sort: {
             field: "category",
             dir: "asc"
         },
         requestStart: function () {
            kendo.ui.progress($("#loading"), true);
          },
         requestEnd: function () {
              kendo.ui.progress($("#loading"), false);
         }
});

FIDDLE

1 个答案:

答案 0 :(得分:2)

将时间设置为默认为延迟时间(4000)的变量。然后检查你的sessionStorage变量,看看我们是否已经运行。如果是这样,将时间设置为0。

在requestEnd上保存sessionStorage变量,并在显示加载动画之前检查它:

var time = 4000;
var HasRun  = sessionStorage.getItem('HasRun');
if (HasRun){
    time = 0;
}
var theDataSource = new kendo.data.DataSource({
    transport: {
         read: function (op) {
             setTimeout(function () {
                 op.success(data);
             }, time);
         }
    },
    group: {
        field: "series"
    },
    sort: {
        field: "category",
        dir: "asc"
    },
    requestStart: function () {
        if (!HasRun){
            kendo.ui.progress($("#loading"), true);
        }
    },
    requestEnd: function () {
        kendo.ui.progress($("#loading"), false);
        sessionStorage.setItem('HasRun', true);
    }
});

更新了 FIDDLE