javascript - 阶乘函数输出不显示，不会从文本框中获取值

Question

我尝试创建的代码运行一个函数，该函数接受您在文本框中输入的任何值并将其分解。当我让它从提示中获取值时，它工作得很好，但现在我试图让它看起来更整洁，并从文本框中获取值，它给了我一个“超出最大调用堆栈大小”错误，并且不会' t 正确执行。我认为函数查找文本框值并将其输入到函数中时遇到问题。

window.onerror = function(message, url, line, col) {
  console.error("Error: " + message + "\nURL: " + url + "\nLine: " + line + "\nColumn: " + col);
  return true;
};
var x = document.getElementById("factortext").value;
function factorial(x) {
  if (x === 0) {
    return 1;
  }
  return x * factorial(x - 1);
}
console.log(factorial(5));
document.getElementById("display").innerHTML = factorial(x);

<h1 id="title">Factorialize!</h1>
<input type="text" id="factortext" name="factor" value="Input Number here!"></input><br><br>
<button onclick="factorial()">Submit</button>
<p id="display"></p>

Answer 1

您需要一个回调函数。只需让该函数调用阶乘即可。

您原来的 onClick 函数中没有参数。

window.onerror = function(message, url, line, col) {
  console.error("Error: " + message + "\nURL: " + url + "\nLine: " + line + "\nColumn: " + col);
  return true;
};

console.log(factorial(5));

function factorial(x) {
  if (x === 0) return 1;
  return x * factorial(x - 1);
}

function calculateFactorial() {
  var x = document.getElementById("factortext").value;
  document.getElementById("display").innerHTML = factorial(x);
}

<h1 id="title">Factorialize!</h1>
<input type="text" id="factortext" name="factor" placeholder="Input Number here!" />
<br><br>
<button onClick="calculateFactorial()">Submit</button>
<p id="display"></p>