onclick keeps calling javascript function

Question

HTML:

<div class="container-fluid">
  <div class = "row text-center" align = "middle">
    <h2>Pseudo Random Quote Machine</h2>
  </div>
  <div class = "row text-center" align = "middle">
    <div class = "col-xs-12 well message" id = "quoting"> 
    </div>
  </div>
  <div class = "row text-center" align = "middle">
    <div class = "col-xs-12">
      <button id = "getMessage" class = "btn btn-primary">
        Get Random Quote
      </button> 
      <button id = "tweet" class = btn btn-primary>Tweet this!
      </button>
    </div>
  </div>
</div>

Javascript:

function randomQuotes() 
{ 
  //array of quotes
  var quotes = [ "\"Operator! Give me the number for 911!\" - Homer J. Simpson", "\"I\'m normally not a praying man, but if you\'re up there, please save me Superman\" - Homer J. Simpson", "\"I\'m in no condition to drive...wait! I shouldn\'t listen to myself, I\'m drunk!\" - Homer J. Simpson", "\"A Degenerate, Am I? Well You Are A Festizo. See, I Can Make Up Words Too, Sister\" - Peter Griffen", "\"Victory Shall Be Mine!\" - Stewie Griffen", "\"He's a spy, blow him up. I'm gonna go take a shit.\" - Rick Sanchez", "\"Ohh yea, you gotta get schwifty. \" - Rick Sanchez", "\"Yo! What up my glip glops!\" - Rick Sanchez", "\"WUBBA LUBBA DUB DUBS!!! \" - Rick Sanchez", "\"Existence is pain to a meeseeks Jerry, and we will do anything to alleviate that pain.\" - Mr. Meeseeks", " \"It\'s morphine time\" - TheRussianBadger"]; 

  var randNum = Math.floor((Math.random() * quotes.length));
  document.getElementById("quoting").innerHTML = quotes[randNum];
}

function tweetThis()
{
  var tweetToShare = document.getElementById("quoting").innerHTML;
  var tweetUrl = 'https://twitter.com/share?text=' +   encodeURIComponent(tweetToShare) + ".";
  window.open(tweetUrl);
}

document.getElementById("getMessage").onclick = function(){randomQuotes();}
document.getElementById("tweet").onclick = function(){tweetThis();}

Basically, any time I click either of the two buttons the function keeps being called over and over again. Here is the code running in Code Pen

I guess my questions would be:

why would the functions be called more than one time ?
What should I do to either stop the functions from being called multiple times or prevent it from happening in the first place?

Working fine on Chrome 58.

yuriy636
– yuriy636

2017-05-28 21:53:18 +00:00
Commented May 28, 2017 at 21:53 — yuriy636
– yuriy636, Commented May 28, 2017 at 21:53
Yep, also fine on firefox 53.

Andreas
– Andreas

2017-05-28 21:56:18 +00:00
Commented May 28, 2017 at 21:56 — Andreas
– Andreas, Commented May 28, 2017 at 21:56
@cancer, you are absolutely right. Thank you.

manny
– manny

2017-05-28 22:05:24 +00:00
Commented May 28, 2017 at 22:05 — manny
– manny, Commented May 28, 2017 at 22:05
@yuriy636 thanks for checking.

manny
– manny

2017-05-28 22:06:46 +00:00
Commented May 28, 2017 at 22:06 — manny
– manny, Commented May 28, 2017 at 22:06
@Andreas thank you for also checking.

manny
– manny

2017-05-28 22:07:03 +00:00
Commented May 28, 2017 at 22:07 — manny
– manny, Commented May 28, 2017 at 22:07

cancer · Accepted Answer · 2017-05-28 21:55:49Z

1

functions seem to be called only one time on chrome. Maybe your browser cached an old script: maiusc+f5 to clean

answered May 28, 2017 at 21:55

cancer

446 bronze badges

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

1 Comment

Jerry B. no.1 intern Over a year ago

A common way this happens is if you have developer tools open on chrome and your still working on your Js file. Having developer tools open on chrome enables caching, you can fix this by going developertools -> network -> disable cache

Collectives™ on Stack Overflow

onclick keeps calling javascript function

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related