Navigate an array of functions by click

Question

I have two buttons (next and back), and I want to execute the next function of an array every time "next" is clicked, and perform the last, when "back" is clicked with jquery. I don`t know where to start...

function1 ();
function2 ();
function3 ();
function4 ();

What should happen if next is clicked and the last executed function was 4? Start all over? — Darin Dimitrov
– Darin Dimitrov, Commented May 8, 2016 at 13:57

Darin Dimitrov · Accepted Answer · 2016-05-08 14:02:57Z

1

You could put those functions into an array:

var functions = [ function1, function2, function3, function4 ];

and have an integer to keep track of the last executed function:

var index = 0;

Now when next is clicked you would invoke the function at the specified index in the array and increment it:

functions[Math.abs(index % functions.length)]();
index++;

When back is clicked do the same but decrement the index:

functions[Math.abs(index % functions.length)]();
index--;

The index % functions.length ensures that the returned value is always within the 0-3 range which is actually the allowed index range for your array.

answered May 8, 2016 at 14:02

Darin Dimitrov

1.0m276 gold badges3.3k silver badges3k bronze badges

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

3 Comments

Fernando Souza Over a year ago

If I don`t want to start it over, how is it look like?

Darin Dimitrov Over a year ago

What do you want to happen if not start over?

Fernando Souza Over a year ago

Just go to the last function with "next", and the "back" will comeback one function.

Collectives™ on Stack Overflow

Navigate an array of functions by click

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related