在调用onClick时，JavaScript函数中未定义全局变量

在HTML表单中，我希望在单击按钮时显示用户输入。这是通过调用一个JavaScript函数来实现的。用户输入保存在变量中，然后在函数中使用。问题是，函数不能识别var，除非它是在它里面定义的

下面是HTML和JS代码。查看（）

或者如果我在函数中定义了var

我需要var是全局的，以便与其他函数一起使用，而不是多次定义它

多谢各位

问题是，函数不能识别var，除非它是在它里面定义的

不，这不是问题所在。可以识别该变量，但它没有所需的值

您试图在用户键入任何内容之前读取输入值

userName

将只包含一个空字符串。您可以通过给输入一个默认值来轻松验证这一点：

<input type="text" name="userName" id="userName" value="default value"/>

---

同样相关：

另一个问题是，您需要在正文内容之后加载脚本标记，或者将所有代码放入on ready函数中，以便知道页面已呈现。在脚本位于实际元素之前时，查找

document.getElementById（“用户名”）返回null，因为浏览器尚未呈现元素。如果您在控制台中查看，您应该会看到这一点

Uncaught TypeError: Cannot read property 'value' of null

谢谢你的回答。我对JS和链接中提供的一些我不了解的内容是陌生的。我没有在HTML中使用任何JS，而是在一个单独的文件中使用。尝试执行您在那里执行的操作，但代码似乎不起作用！现在，如果我加载var并在需要时读取值，代码就会工作：window.onload=function（）{var userName=document.getElementById（“userName”）；}；函数run（）{document.getElementById（“outputUserName”）.innerHTML=userName.value；}在您的示例中，该变量是onload处理程序的本地变量。最简单的解决方案是只在页面末尾包含脚本。链接问题中也解释了这一点。感谢您的回答，我尝试使用：$（document）.ready（function（））加载JS文件，但它似乎不起作用。然而，当我尝试这个：window.onload=function（）{}并将我的var放入其中时，它加载并起作用（它来自Felix提供的链接）
<input type="text" name="userName" id="userName" value="default value"/>

var userName =  document.getElementById("userName");
function run() {
    document.getElementById("outputUserName").innerHTML = userName.value;
}

Uncaught TypeError: Cannot read property 'value' of null