Call multiple JavaScript functions in single onclick event

You might have a situation where you need to call multiple JavaScript functions in a single onclick event. So in this post, we are going to tackle the same situation.

There are two methods to call multiple JavaScript functions :

1. Call the functions by separating them by “;”. for example: onclick=”funca();funcb();”
2. Wrap all functions in a new JavaScript function and call it.

First solution:

function a() {
    console.log("a");
}

function b() {
    console.log("b");
}

Then in HTML, you can call these functions as mentioned below:

<button>Click Me</button>

In the above example we have called two functions a() and b() by separating them “;”. This is very easy and there is no extra code in this approach.

Second solution:

function a() {
    console.log("a");
}

function b() {
    console.log("b");
}

function c() {
    a();
    b();
}

Then in HTML, you can call these functions as mentioned below:

<button>Click Me</button>

In this second approach, we have wrapped our functions in new function c(). You might have noticed that in this approach we have written extra code to achieve the same result.

Leave a Reply Cancel reply