jQuery: определение элементов в литерале объекта?

Question

Я пытаюсь определить все мои основные переменные в объекте с именем globals.Проблема в том, что, когда дело доходит до использования предыдущего элемента, такого как membersTab, чтобы получить faces, я получаю ошибку:

Uncaught TypeError: Невозможно прочитать свойство membersSab из undefined

Что я делаю не так?

 var globals = {
  siteWrap      : $('#siteWrap'),
  content       : $('#content'),
  membersTab    : $('#membersTab'),
  faces     : globals.membersTab.find('.member'),
  members       : {},
  mID       : globals.siteWrap.attr('mID'),
  uID       : globals.siteWrap.attr('uID'),
  mTag      : globals.siteWrap.attr('mTag'),
  uFirst        : globals.siteWrap.attr('fn'),
  uLast     : globals.siteWrap.attr('ln'),
  host      : globals.siteWrap.attr('host'),
  dialogueBox   : $('#dialogueBox'),
  screen        : $('#screen').click(function(){ closeDialogue(true); })
  }

Answer 1

Если ваше определение globals не внутри $(document).ready(), возможно, страница еще не загружена, поэтому $('#membersTab') возвращает пустую коллекцию.

Более того, когда вы объявляете facesобъект globals еще не создан.

Самый простой способ - это что-то вроде

globals = {};
globals.membersTab = $('#membersTab');
globals.faces = globals.membersTab.find('.member');
...

Answer 2

Элемент membersTab не инициализируется до тех пор, пока литерал не будет закрыт.

Сначала объявите глобальный объект.Нулевые присваивания не являются необходимыми, но существуют для ясности и также дают хорошее завершение кода, если редактор имеет такую ​​поддержку.Это может уменьшить количество ошибок при печати. ​​

var globals = {
    siteWrap = null,
    content = null,
    ...
};

Инициализировать объект после загрузки DOM.

$(function(){
    globals.siteWrap = $('#siteWrap');
    globals.content = $('#content');
    ...
})