Question

guys. I have something like this:

myThing = {
    str:"my string",
    setClick: function(){
        $("button").click(function(){
            alert(this.str);
        });
    }
}

myThing.setClick();

The problem is when I click the button the function doesn’t know what str is. alert(str) gives me an error (str is not defined) and no alerts. alert(this.str) gives me the alert but containing undefined.

I can see that this reffers to the button and the button doesn’t have any attribute called str. So how can I access the str that is out of jQuery’s function?

Answer 1

Save a reference to this in setClick, outside the click event handler:

myThing = {
    str:"my string",
    setClick: function() {
        var self = this;
        $("button").click(function() {
            alert(self.str);
        });
    }
}

DEMO.