function create button with a passing argument onclick function

Question

Can someone explain me like i'm five why is it executing the function without the click event. And how to fix it. Thanks.

function test(){
    alert("works");
}

function createButton(name,location,id,funX){
    var button = document.createElement("input");
    button.type = "submit";
    button.name = name;
    button.id = id;
    button.onclick = funX;
    var placeHolder = document.getElementById(location);
    placeHolder.appendChild(button);
};



window.onload = function () {
    createButton("Submit","content","submitEnd",test());
};

http://jsfiddle.net/mabui91/yLoty39s/

adeneo · Accepted Answer · 2015-01-09 10:30:47Z

3

When you add parenthesis to a function, you call it. Not later, but right then and there, and you return what ever the function returns.

A function in javascript returns undefined by default, unless you explicitly return something else.

What you're really writing is

createButton("Submit", "content", "submitEnd", undefined);

The last undefined is because you called the function, it would be the same as

var result = test(); // undefined

createButton("Submit", "content", "submitEnd", result);

The way to solve it, is to reference the function, not call it

createButton("Submit", "content", "submitEnd", test);

See, no parenthesis.

FIDDLE

answered Jan 9, 2015 at 10:30

adeneo

319k29 gold badges409 silver badges392 bronze badges

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

2 Comments

Mouser Over a year ago

You should consider a career in education.

Mouser Over a year ago

The best things in life are!

Collectives™ on Stack Overflow

function create button with a passing argument onclick function

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related