如何使JavaScript函数等待输入或值？

正如您在下面看到的，我有一个函数createCharacter（），它调用另一个函数getUserInput（）。此函数用于获取文本输入元素的值，并返回要存储在createCharacter内的“name”变量中的值。但是，如果您运行此代码。它完全通过这两个函数运行，从不给用户提供输入值的机会。也许一个更具体的问题是，如何让这个函数在返回到createCharacter之前等待变量被定义？我尝试将代码包装在while循环中，只要值未定义，该循环就会运行。不起作用，创建了一个无限循环并崩溃。对此问题的任何解决方案都将不胜感激。我觉得解决办法很简单，但我就是想不出我的生活。谢谢

var messageDisplay=document.querySelector（“.messageDisplay”）；
var menuInput=document.querySelector（“菜单输入”）；
var playerInput=document.querySelector（“.player text”）
函数createCharacter（）{
messageDisplay.textContent=“欢迎！你叫什么名字？”；
var name=getUserInput（）；
messageDisplay.textContent=“你好”+姓名+“！”；
}
函数getUserInput（）{
var textValue=playerInput.value；
返回文本值；
}
createCharacter（）

文件
我认为您对DOM和用户的交互方式有误解。DOM是。您可以从向输入元素（或在“提交”按钮上）添加开始：

然后删除对
createCharacter
的调用，这是您发布的代码中的最后一行

当您更改输入中的文本时，这将调用
createCharacter（）
方法，这可能不是您想要的。您也可以尝试：

var menuSubmit = document.querySelector(".submit-button");
menuSubmit.onclick = createCharacter;

这可能更符合正确的轨道

然而，考虑到您最初的误解，也许您需要重新考虑如何处理您的设计

它立即遍历代码的原因是因为最后一行。浏览器加载JS并执行全局范围内的所有内容。查询选择器将运行并存储在这些变量和定义的函数中，然后在最后一行调用其中一个定义的函数

要解决此问题，您需要重新设计应用程序，使其基于事件。继续在全局范围内定义所需的变量和函数，就像您在这里所做的那样，但随后将执行更改为响应事件。
我认为您正在寻找类似的内容。你应该利用这些事件来得到你想要的。您正在执行createCharacter（），甚至在用户单击Submit按钮之前。因此您会看到“Hello！”，因为最初没有用户输入


函数已提交（事件）{
var messageDisplay=document.querySelector（“.messageDisplay”）；
var playerInput=document.querySelector（“.player text”）；
messageDisplay.innerHTML=“Hello”+playerInput.value；
}

文件
非常感谢您！很有道理，我现在完全明白我的方法有缺陷。我知道函数是在初始创建阶段运行的。所以，我应该更清楚。谢谢你帮助一个新手看到光明！：）@塞德，np。我很乐意回答一个写得很好、格式很好的问题。似乎去年左右所有的新用户都在发布“它不工作”。
var menuSubmit = document.querySelector(".submit-button");
menuSubmit.onclick = createCharacter;