jQuery：在对象文字中定义元素？

Question

我试图在名为 globals 的对象中定义所有主要变量。问题是，当使用诸如 membersTab 之类的先前元素来抓取 faces 时，我收到错误：

未捕获类型错误：无法读取未定义的属性“membersTab”。

我做错了什么？

 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');
    ...
})