wilsonpage wilsonpage - 2 months ago 5
jQuery Question

jQuery : Defining elements in the object literal?

I am trying to define all my main variables within an object called

. The problem is that when it comes to using a previous element such as
to grab
I get the error:

Uncaught TypeError: Cannot read property 'membersTab' of undefined.

What am I doing wrong?

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


If your definition of globals is not inside $(document).ready(), it is possible that the page is not yet loaded, hence $('#membersTab') returns an empty collection.

Moreover when you declare faces, the object globals is not yet created.

The simplest way is probably something like

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