首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >将jQuery load与promises一起使用

将jQuery load与promises一起使用
EN

Stack Overflow用户
提问于 2011-06-28 21:26:26
回答 2查看 17.4K关注 0票数 21

我仍然在试图理解deferred以及什么不是,所以考虑到这一点,我有一个关于如何做以下事情的问题。

我的团队和我有3个独立的.load()方法,每个方法都获取一个特定的模板,并将其附加到相同的容器中。每次加载所需的时间可能与您想象的不同,因此当内容加载时,它会以“阶梯式”方式加载(1,然后2,然后3)。我想使用deferred objects并等待它们全部完成,然后同时添加它们以删除“stair step”操作。

代码语言:javascript
复制
$('<div>').load(baseInfoTemplate, function () {
    var baseData = {
        // build some object
    };

    $.tmpl(this, baseData).appendTo($generalContainer);
});

这三个调用都类似于上面的调用。

我如何才能做到这一点?

EN

回答 2

Stack Overflow用户

发布于 2013-09-06 18:21:25

在这种情况下,我使用下一段代码:

代码语言:javascript
复制
$.when(
    $.get('templates/navbar.tmpl.html', function(data) {
        $('#navbar').html(data);
    }),
    $.get('templates/footer.tmpl.html', function(data) {
        $('#footer').html(data);
    }),
    $.Deferred(function(deferred) {
        $(deferred.resolve);
    })
).done(function() {
    $.getScript("js/tools/jquery.min.js");
});

在我看来,它看起来比以前的实现更有结构,也更好。

票数 9
EN

Stack Overflow用户

发布于 2014-07-22 18:35:44

我使用以下代码作为泛型库

代码语言:javascript
复制
var loader = {};
(function(){
  var fn = {  
    promises: [],
    templates: [],

    loadTemplate: function( name ) {
      fn.promises.push(
        $.get( `templates/${name}.tmpl.html`,
               (html) => fn.templates.push( html )
        )
      );
    },

    main: function( templates, callback ) {
      templates.forEach( (template) => fn.loadTemplate( template ));
      $.when.apply( $, fn.promises ).done( function() {
        $( '<div id="templates">' ).html( fn.templates.join() ).appendTo( 'body' );
        callback();
      });
    }
  };

  /* EXPORTS */
  loader.main = fn.main;
})();

然后调用它作为应用程序的主js文件中的第一个函数。

代码语言:javascript
复制
function myMain() {
  ... // do all the things
}

$( document ).ready( function() {
  templates = [ 'thingies', 'wotsits', 'oojamaflips' ];
  loader.main( templates, () => myMain());
});
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/6507181

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档