我可以在 Javascript 的局部函数中访问全局变量吗？
我正在尝试访问变量name、email、pass，但每次我尝试这样做时，User.NAME、User.Email_ID和User.PASSWORD都有空值。我不应该能够在全球范围内使用这 3 个变量吗？
<html>
<head><title>Document</title></head>
<body bgcolor="yellow">
<input type="text" id="name"><br>
<input type="email" id="mail"><br>
<input type="password" id="pass"><br>
<button onclick="Register()">Register</button>
<button onclick="Show()">Show in console</button> <br>
<div id="view" style="background-color: red; color:white; font-family: algerian; text-align: center;"></div>
<script>
const student=[];
var name= document.getElementById("name").value;
var mail= document.getElementById("mail").value;
var pass= document.getElementById("pass").value;
var Register = function() {
let User=JSON.parse(`{"NAME":"`+name+`", "EMAIL_ID":"`+mail+`", "PASSWORD":"`+pass+`"}`);
console.log(User);
student.push(User);
}
function Show() {
setTimeout(function() {
let n=student.length;
var text="";
for (let i = 0; i < n; i++) {
text=text+"Name="+student[i].NAME+", Email="+student[i].EMAIL_ID+", Password="+student[i].PASSWORD+"<br>";
}
document.getElementById("view").innerHTML=text;
}, 2000);
}
</script>
</body>
</html>
江户川乱折腾2回答
-
万千封印
是的，绝对可以。您出错的地方是您过早地分配了输入的值。让我们来看看。var name= document.getElementById("name").value;var mail= document.getElementById("mail").value;var pass= document.getElementById("pass").value;当浏览器解析您的代码时，它会立即为变量分配输入值，并且此时它包含空值。您此时只想像这样引用输入元素。var userName= document.getElementById("name"); // note we change the variable from name to userName hence we cannot uses "name" as a variable var mail= document.getElementById("mail");var pass= document.getElementById("pass");并获取 register() 函数中元素的值。尝试查看整个代码：const students = []; let userName = document.getElementById('name') let mail = document.getElementById('mail') let pass = document.getElementById('pass') function register() { let user = { name: userName.value, email_id: mail.value, pass: pass.value }; console.log(user); students.push(user); } function show() { setTimeout(function () { let text = ''; for (const student of students) { text = `Name=${student.name}, Email=${student.email_id}, Password=${student.pass} <br>` } document.getElementById("view").innerHTML = text; }, 2000); } -
眼眸繁星
问题是您在页面加载时获取输入值，而不是在单击“注册”按钮时获取输入值。所以将这些行移动到Register函数中。我必须提到，JSON.parse在自建字符串上使用是一种反模式。您应该使用普通的旧对象文字。不太重要，但通常的做法是对变量使用驼峰命名法，并为构造函数/类保留 PascalCase。所以重命名User为user. 这同样适用于属性，但我让它们保持原样，因为它会影响您的其他代码： var Register = function() { var name= document.getElementById("name").value; var mail= document.getElementById("mail").value; var pass= document.getElementById("pass").value; let user= { "NAME": name, "EMAIL_ID": mail, "PASSWORD": pass }; console.log(user); student.push(user); }
随时随地看视频慕课网APP
相关分类
JavaScript