为什么我的按钮不再次调用该函数?

时间:2019-01-02 19:54:48

标签: javascript html dom button

我一直试图创建一个按钮来再次调用一个函数以显示新的HTML段落,但是由于某些原因它不会这样做。

我试图在JS文件中的按钮上进行函数调用,但是当我单击按钮时按钮没有任何改变。一切都保持不变。

这接近HTML的结尾,我在此处创建了按钮:

<p>&#8220;We labour at our daily work more ardently and thoughtlessly than is necessary to sustain our life because it is even more necessary not to have leisure to stop and think. Haste is universal because everyone is in flight from himself.&#8221;</p>
<p>&#8220;One should die proudly when it is no longer possible to live proudly.&#8221;</p>
    </div>
    <button class="button">Thus Spoke Nietzsche</button>
<script src="randomize.js"></script>
</body>

这是JS:

"use strict";
const quotes = document.querySelectorAll("p");

const randomize = function() {
    let num = (Math.floor(Math.random() * Math.floor(quotes.length)) - 1);
    let quote = quotes.item(num).innerHTML;
  return quote;
}
const run = function(){
  let randomQuote = randomize();
  let passage = document.getElementById('quotes');
  passage.innerHTML = randomQuote;
  return console.log(randomQuote);
}
const newQuote = document.querySelector('.button');
newQuote.addEventListener('click', run());

感谢您的帮助。

1 个答案:

答案 0 :(得分:1)

所以至少有一部分问题是这样的:

newQuote.addEventListener('click', run());

哪个应该是:

newQuote.addEventListener('click', run);

addEventListener 希望您为其提供的第二个参数是一个函数。这就是单击 newQuote 时执行的功能。但是,当您说 run()(带有括号)时,实际上是调用运行功能并将结果提供给 addEventListener 情况为未定义

可能还有更多问题,但是我没有时间真正地创建一支数字笔并对其进行彻底的研究,但这对我来说是第一件事。