Question

Sorry for the long winded title, but I think it summaries my problem

I have created a jsfiddle to cut down and create a simplified problem of my dilemma
http://jsfiddle.net/afw6k/3/

<input id="txtA"/>
<!-- after setupOnclick is executed my onlick for txtA should be onclick="someObj.log("Clicked!")"-->
<script>
    function someObject(field){
        this.field = field;

        this.log = function(msg){
            if(this.field.value != "") this.field.value += ", ";
            this.field.value += msg
        }

        this.setupOnlick = function(){ 
            field.onlick = function(){//So how do I pass this (as in someObject) to this?
                this.log("Clicked!"); //As if I have written someObj.log("Clicked!");
            }
        }
    }

    var someObj = new someObject(document.getElementById("txtA"));
    someObj.setupOnlick();
</script>

I’m not trying to simply write something to a textbox when clicked, but the above is a simplified version of what I am trying to accomplish here.

Passing this (the object) into an objects functions nested function

Or is there a far better way to accomplish this?

Answer 1

Save this in a variable:

    this.setupOnlick = function(){ 
        var theObj = this;
        field.onlick = function(){//So how do I pass this (as in someObject) to this?
            theObj.log("Clicked!"); //As if I have written someObj.log("Clicked!");
        }
    }

The value of this is just a value, so it can be copied to another variable. The variable “theObj” will remain in scope of the “click” handler when it runs.