jquery - how to access object values set in another function?

I'm lost again.

I'm using the jquery widget factory. I declare a global object that keeps track of visited pages. I set this in one function and need to access it from another function, which I can't get to work.

Can someone tell me, what I'm doing wrong here:

(function($,window){
$.widget("mobile.multiview",$.mobile.widget, {
       vars: { 
          hist:{},
          // there is 4 panel elements, which contain several pages each
          $panel:$("div:jqmData(role='panel')") 
          },
    _create: function() {
           // access vars
           var self = this;

           // run through all panels, retrieve each panel ID
           $panels.each(func开发者_开发知识库tion(index) {
           var id = $(this).jqmData('id');

           // sorry, this was pasted to quickly
           // for each panel I'm setting an object 
           // and adding the ID of the first page (data-show="first") to the object
           self.vars.hist[id] = ['#'+$(this).find(':jqmData(role="page")').attr('id')];
           console.log("entry made");
           //console.log("entry: "+self.vars.hist[id][0]);
            });
          },
     crumble: function(event, data, page) {
          var self = $( '#'+page.attr('id') ),
              $crumPanel = $( '#'+page.attr('id') ).closest('div:jqmData(role="panel")'),
              $backup = self.vars.hist[$crumPanel.jqmData('id')][self.vars.hist[$crumPanel.jqmData('id')].length-1];
              // this stays undefined...
              console.log( $backup );

I hoped by declaring hist on a global level it would be possible to access the stored information, similar to other variables I create within the vars section. But it isn't... I guess only the empty object is stored globally.

So how can I access the "local" data, filled into the object inside _create?

Thanks for help!

Have never used that widget plugin, but you could consider using jQuery's .data() instead of global vars. You would probably do something like this:

$(ElementID).data('name', '#'+$(this).attr('id'));

and to access it in another function:

var mydata = $(ElementID).data('name');

In "crumble", you're defining self to be what I assume is the widget's element on the page?

In the context of a widget method, this === the instance of the plugin. this.element === the jquerified element that the widget was created on top of.

What you're trying to do won't work because the jquerified element doesn't have the "vars" var, the widget's prototype does. Try doing console.log( this.vars.hist ) in the method to illustrate what I mean.

It was a timing issue. I set crumble to fire on pagecreate, which fired earlier than _create. So I could not access the object elements from crumble as they were not set.

By binding to pageinit inside _create (this supercedes pagecreate event, I can call the hist object from other functions as well.

I put it in the global vars to basically do just that. Define it on a widget-wide basis and make it accessible from all widget functions.