我正在尝试访问变量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 回答
万千封印
TA贡献1891条经验 获得超3个赞
是的，绝对可以。
您出错的地方是您过早地分配了输入的值。
让我们来看看。
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);
}
眼眸繁星
TA贡献1873条经验 获得超9个赞
问题是您在页面加载时获取输入值，而不是在单击“注册”按钮时获取输入值。
所以将这些行移动到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);
}
添加回答
举报
0/150
提交
取消