How to initialize a jQuery object once the layout has rendered?

问题

I would like to define a few variables that I use to scope my jQuery selectors later on right after my app layout has been rendered.

I tried to define them with:

Meteor.startup(function () { /* Define variables */ })

But it did not work, the objects were empty

Here is how I declare my application layout :

Router.configure({
  layoutTemplate: 'layout'
});

Here is the layout itself :

<template name="layout">
  <div id="page_container">
    <header id="page_header">
    </header>

    <div id="page_content">
      {{> yield}}
    </div>
  </div>
</template>

Here are the variables I am willing to declare :

  L.BODY = $("body");
  L.PC   = $("#page_content", L.BODY);

The declaration itself works fine, but L.BODY show the body of my application is still empty by the time I try to declare those variables.

How can I define jQuery objects once the layout of my application has rendered?

回答1:

layout is just another template. jQuery needs the DOM element to exist to create an object out of it.

From there the onRendered callback is the way to go:

Template.layout.onRendered(function() {
  L.BODY = $('body');
  L.PC   = $('#page_content', L.BODY);
});

来源：https://stackoverflow.com/questions/32550273/how-to-initialize-a-jquery-object-once-the-layout-has-rendered