在页面完全渲染后初始化函数时遇到问题(Meteor)

时间:2016-08-26 05:56:13

标签: javascript jquery html twitter-bootstrap meteor

我正在尝试使用一个图像Lazy Loading包,需要我通过调用来初始化延迟加载

> $("img").unveil();

起初听起来很容易,但我开始意识到在实际呈现包含图像的div之前会调用它。我需要在渲染完所有内容后调用这个初始化函数。

以下是问题细分:

  1. 假设我有一个名为postlist的模板,在这个模板中只是{{&&;帖子}}。
  2. 我还有一个名为posts的模板,其中包含我想要延迟加载的图像。
  3. 我想在帖子列表模板onRendered上调用$ (“img”)。unveil(),因为如果我在帖子模板上调用它,它将被多次调用(假设我有超过1个帖子,这会导致性能问题。
  4. 如果我在邮件列表上调用它,它将无法工作,因为在发布模板上的图像甚至呈现之前调用 $(“img”)。unveil()
  5. 以下是我试图解决的一些问题:

    我在帖子模板onRendered上调用了$(“img”)。unveil(),但它仍然不会注册,因为在post.html上,我有这个:

     {{#if isReady}}
       ((content containing image))
     {{else}}
       {{> loadingtemplate}}
     {{/if}}
    

    在帖子onRendered上调用$(“img”)。unveil()的问题是,当isReady在开头为假时将调用它,因此没有渲染图像,只有加载模板。如果我将setTimeout添加到unveil,它会起作用但会导致口吃,因为有多个$(“img”)。unveil()会导致性能问题。 setTimeout也是我想避免使用的东西,因为即使在setTimeout完成后,网速较慢的人实际上仍然可能在加载模板上。

    我也在postlist onRendered上尝试了setTimeout,但由于我上面提到的内容,它可以避免。

    最后,我在postlist onRendered上尝试了setInterval,这会导致多次调用$(“img”)。unveil(),然后出现性能问题。

    在渲染完所有图像div后,有没有办法调用此初始化函数?我错过了一个帮助我解决这个问题的关键功能吗?我在Bootstrap的工具提示中也遇到了这个问题,需要我在渲染工具提示后使用$('[data-toggle =“tooltip”]')初始化它们.tooltip()。我通过在其上设置setInterval但在$(“img”)上设置setInterval解决了这个问题.unveil()会导致滞后。任何帮助或建议将不胜感激!提前谢谢。

0 个答案:

没有答案
相关问题