将数据加载到页面元素而不冻结整个页面

时间:2017-06-29 11:33:33

标签: javascript jquery html iframe lazy-loading

我有一个包含菜单选项和几个Iframe的主页面。 其中一个Iframe页面有许多DIV元素,这些元素最初都是空的。所以一切都很快加载。

每个DIV的数据获取查询都有点长时间运行。所以我想逐个加载数据到DIV,而不冻结我的主页面和它的菜单选项。

如何在数据提取功能运行时保持页面处于活动状态?

请建议。

1 个答案:

答案 0 :(得分:0)

解决了它。

基本上,需要使用异步AJAX调用。真正救了我的命令是JQuery .ajaxStop()。只要AJAX命令完成,就会触发此命令。所以我为我的第一个元素和休息调用ajax数据,我把它保存在ajax.stop下。

因此,元素通过调用异步ajax调用来加载对象数据。一旦完成,它会立即触发第二个元素。直到我的所有对象都被加载

这种方法是无缝的。页面永远不会等待数据到达。在数据到达时加载。 我的页面正在加载几个HightChart报告。

   function startLazyLoading() {
        $("SELECT").each(function (index) {
            filter_load_count++;
            $(this).submit();
            return false;
        });
    }

    $(document).ajaxStop(function () {
        $("SELECT").each(function (index) {
            if (typeof $(this).attr('onsubmit') !== "undefined") {
                filter_load_count++;
                $(this).submit();
                return false;
               }
          }
    });