首页 > 解决方案 > 函数不全局更改全局变量?

问题描述

出于某种原因,我的函数中设置的变量仅适用于函数的范围,即使声明前面有窗口:

<body>
<input id="usernameBox" placeholder="Name">
<input id="ageBox" placeholder="Age">
<br>
<button onclick="changeUsername(), changeAge()"id="niceButton">Confirm</button>
<script>
    var username;
    var age;
    function changeUsername(){
        window.username=document.getElementById("usernameBox").value
        console.log(username)
    }
    function changeAge(){
        window.age=document.getElementById("ageBox").value
        console.log(age)
    }
    console.log(username);
</script>

最终的控制台日志应该记录在文本框“usernameBox”中插入的内容,但它只是打印未定义,即使在单击按钮之后也是如此。我什至在函数中添加了一个检查器,它们在单击时正确记录文本框内的内容,那么为什么用户名在函数之外仍未定义?

标签: javascripthtml

解决方案


您的问题是<script>标签在过程的一开始就被调用。因此,您甚至在设置之前就对其进行了记录。
尝试制作一个打印出两个值的函数,例如:

function LogStuff(){
    console.log(username, age);
}

并在以下事件之后调用它:

<button onclick="changeUsername(); changeAge(); LogStuff();"id="niceButton">Confirm</button>

它在函数中工作的原因是因为您在使用它们之前在本地设置了全局变量,所以它不再是未定义的


推荐阅读