Function undefined in jquery / javascript

Question

zoom: function ( element, scale ){.....},
init: function() {
    $("#book div img").live('dblclick', function() {
       ...
       $( "#slider" ).slider({
       ...
          slide: function( event, ui ) {
             //call function here
             zoom (element,ui.value);
          }
       });
    });
},

There are two function, zoom and the main function. The main function call zoom function to perform work, how ever, since it is not at the same level, the browser return the error of undefined function 'zoom' . How to fix this (Able to call zoom inside the slide:function)?

have you tried saving this in a var and calling this.zoom? — jbabey
– jbabey, Commented Dec 11, 2012 at 2:26
this adding: var self = this; after init: function(){ then use self.zoom(). Looks like a scope issue from here. — Brad Christie
– Brad Christie, Commented Dec 11, 2012 at 2:30

jbabey · Accepted Answer · 2012-12-11 02:34:30Z

2

Store a reference to the this object in the outermost scope of your functions. Then call this.zoom() inside your callback:

zoom: function ( element, scale ){.....},
init: function() {
    // store a reference to the object these functions are being added to
    var that = this; 

    $("#book div img").live('dblclick', function() {
       ...
       $( "#slider" ).slider({
       ...
          slide: function( event, ui ) {
             // use the var you made above to call zoom
             that.zoom (element,ui.value);
          }
       });
    });
},

simplified example: http://jsfiddle.net/u5ZL3/

answered Dec 11, 2012 at 2:34

jbabey

46.7k12 gold badges73 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 10:24:57Z

0

Shamelessly taken from: How do I declare a namespace in JavaScript?

//Public Method
skillet.fry = function() {
    var oliveOil;

    addItem( "\t\n Butter \n\t" );
    addItem( oliveOil );
    console.log( "Frying " + skillet.ingredient );
};

//Private Method
function addItem( item ) {
    if ( item !== undefined ) {
        console.log( "Adding " + $.trim(item) );
    }
}

edited May 23, 2017 at 10:24

CommunityBot

11 silver badge

answered Dec 11, 2012 at 2:34

user1878526

1 Comment

jbabey Over a year ago

not entirely relevant since the poster is using an object literal pattern and it does not solve the issue in the post, but good information regardless...

Mihai P. · Accepted Answer · 2012-12-11 02:52:56Z

0

If your class is called Bob, you can just call the function like this

Bob.zoom (element,ui.value);

The other solution would be to use "this" that has some advantages over calling the class name I believe but requires more code.

answered Dec 11, 2012 at 2:52

Mihai P.

9,3673 gold badges40 silver badges50 bronze badges

Collectives™ on Stack Overflow

Function undefined in jquery / javascript

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related