Question

I’m new to using callback functions and struggling trying to hook some up through jquery that are to be called when certain ui elements are changed. This is a very simplified example of what I’m doing. If I call the e.SetBorderWidth then it passes 10 into the function correctly. However, if I try to use the callback the SetBorderWidth is getting undefined. Any idea why and what I need to change? Thanks.

javascript code—-

element = {
    border: {
        width:0
    },

    SetBorderWidth : function(newWidth){
        this.border.width = newWidth;
    }
};

elementChild = function(){
    padding: 0
};

elementChild.prototype = element;


var e = new elementChild();

var callback = e.SetBorderWidth;

function SetWidth(){
    e.SetBorderWidth(10);
    alert(e.border.width);

    callback.call(10);
    alert(e.border.width);
}

and the html code

<input type="button" onclick="SetWidth();" value="Click" />

Answer 1

just do callback(10); adding .call passes 10 as the context (this variable) instead of the argument.