CODEWITHSUNDEEP
javascriptsetinterval
Alex Silverman
Alex Silverman

Reputation: 203

How does setInterval() work with button.onclick

I want the alertMe function to be called only when the button is clicked, but it gets called (the setInterval gets called which calls that) AS SOON AS THE PAGE LOADS. But if I take the pageLoad function away, then startButton is null and I can't do anything with it.Thanks in advance, guys!

/when user clicks start, start the animation
window.onload = pageLoad;

function pageLoad() {
    var startButton = document.getElementById("start");

    startButton.onclick = setInterval(alertMe,200);
}

function alertMe() {
  alert("hi");
}

Upvotes: 2

Views: 36779

Answers (2)

Teneff
Teneff

Reputation: 32158

basically you need to do it like this:

startButton.onclick = function() {
    interval = setInterval(alertMe, 200);
}

what it does is it sends reference to the alertMe function

another way would be:

startButton.onclick = function() {
    interval = setInterval(function(){
        alertMe();
    }, 200);
}

which would send a reference to an anonymous function which will call the alertMe function

Upvotes: 3

ahren
ahren

Reputation: 16961

function pageLoad() {
    var startButton = document.getElementById("start");

    startButton.onclick = alertMe;
}

function alertMe() {
  setInterval(function(){
    alert("hi");
  },200);
}

Move your interval inside the alertMe function, and pass that as a reference to startButton.onclick

DEMO: http://jsfiddle.net/gHS4a/

Upvotes: 11

Related Questions