javascript - 在调用函数之前更新 inner.html

Question

如果用户输入的值小于 5，我希望更新 inner.html 并再次提示用户。该代码本身就可以运行，但我希望它进行 inner.html 更新并再次提示用户，而不是仅在没有更改 inner.html 的情况下进行提示。

编辑：我不认为这是重复的，另一个问题询问回流操作何时以及如何发生。但这并没有解决我遇到的问题，即在提示之前更新inner.html，除非我错过了什么。

players = []
function numberOfPlayers() {
    playerCount = prompt("Please enter number of players. A minimum of 5 players is required.", "5");
    if (playerCount === null) {
      return;
    }
    if (parseInt(playerCount) >= 5) {
        document.getElementById("intro").innerHTML =
          "There are " + playerCount + " players."; 
        namesOfPlayers(playerCount);
        } else {
      document.getElementById("intro").innerHTML =
        "Invalid. A minimum of 5 players is required. Hit the button to try again." 

          numberOfPlayers(); //I want it to update the text before calling numberOfPlayers() again 
//the prompt pops up without the text changing.
          }
    } 
function namesOfPlayers(playerCount) {
    for (i = 1; i <= playerCount; i++) {

        var playerName = prompt("Enter name of player " + i, "John Doe")
        players.push(playerName)
        }
      document.getElementById("names").innerHTML =
        "The players are " + players.toString();
    }



</script>

<p id="intro">Click the button to begin the game.</p>

<button onclick="numberOfPlayers()">Begin</button>

<p id="names"></p>

标签： javascripthtmlinputprompt