Javascript JS:ReferenceError:未定义函数

加载HTML文件时，它会自动显示一个“登录窗口”（请参阅函数

draw\u login

）。单击“生成”按钮时，出现以下错误：

ReferenceError:未定义emit_登录

window.onload=function（）{
var socket=io（）；
draw_login（）；
函数emit_login（）{
var login\u name=document.getElementById（“login\u name”）.value；
var login\u password=document.getElementById（“login\u password”）.value；
socket.emit（'login'{
姓名：“，
pw:“
});
}
函数draw_login（）{
document.getElementById（“状态栏”）.innerHTML=
'名称：
'+
'密码：
'+
“登录”；
}
}

有人有什么想法或建议吗？

---

提前谢谢

正如丹尼尔·怀特所说

将其移到

onload

功能之外

正如Amit所说，如果您想了解为什么需要这样做，您应该阅读JavaScript中的作用域，因为这是导致错误的原因。函数

emit\u login

是在匿名函数

窗口中创建的。onload

，这意味着

窗口之外的任何内容。onload

将无法访问此窗口之外的任何内容

---

如果我在这里说错了什么，请纠正我。很长时间没有使用JS了。

正如Daniel A.White所说

将其移到

onload

功能之外

正如Amit所说，如果您想了解为什么需要这样做，您应该阅读JavaScript中的作用域，因为这是导致错误的原因。函数

emit\u login

是在匿名函数

窗口中创建的。onload

，这意味着

窗口之外的任何内容。onload

将无法访问此窗口之外的任何内容

---

如果我在这里说错了什么，请纠正我。很长时间没有使用JS了。

您似乎收到了此错误，因为您的单击处理程序调用了emit\u login函数，该函数与onload中调用的函数的作用域不同

函数emit\u login（）{
var login\u name=document.getElementById（“login\u name”）.value；
var login\u password=document.getElementById（“login\u password”）.value；
警报（'登录'{
姓名：“，
pw:“
});
}
（功能（）{
draw_login（）；
函数draw_login（）{
document.body.innerHTML=
'名称：
'+
'密码：
'+
“登录”；
}
}())

---

尝试在onload处理程序之外定义emit_login函数，一切都会正常工作

您似乎收到了此错误，因为您的单击处理程序调用了emit_login函数，该函数与onload中调用的函数的作用域不同

函数emit\u login（）{
var login\u name=document.getElementById（“login\u name”）.value；
var login\u password=document.getElementById（“login\u password”）.value；
警报（'登录'{
姓名：“，
pw:“
});
}
（功能（）{
draw_login（）；
函数draw_login（）{
document.body.innerHTML=
'名称：
'+
'密码：
'+
“登录”；
}
}())

---

尝试在onload处理程序之外定义emit_login函数，一切都会正常工作

将内容排除在全局范围之外是一件好事，但是当您将其与内联eventlisteners（例如

onclick=“emit\u login（）”

结合使用时，它就不起作用了

您可以在draw_登录中执行以下操作，而不是使用内联eventlistener：

function draw_login() {
    document.getElementById("status_bar").innerHTML = 
        'Name:<input type="text" id="login_name"></input><br>'+
        'Password:<input type="password" id="login_password"></input><br>'+
        '<button type="button">login</button>';

    document
        .querySelector('#status_bar button')
        .addEventListener('click', emit_login, false);
}

函数draw\u login（）{
document.getElementById（“状态栏”）.innerHTML=
'名称：
'+
'密码：
'+
“登录”；
文件
.querySelector（“#状态栏按钮”）
.addEventListener（'click'，emit\u login，false）；
}

---

更新：整个要点是不鼓励使用onclick属性，这绝对不是javascript的一个好部分。

将内容排除在全局范围之外是一件好事，但是当您将它与内联事件监听器（例如

onclick=“emit_login（）”

结合使用时，它就不起作用了

您可以在draw_登录中执行以下操作，而不是使用内联eventlistener：

function draw_login() {
    document.getElementById("status_bar").innerHTML = 
        'Name:<input type="text" id="login_name"></input><br>'+
        'Password:<input type="password" id="login_password"></input><br>'+
        '<button type="button">login</button>';

    document
        .querySelector('#status_bar button')
        .addEventListener('click', emit_login, false);
}

函数draw\u login（）{
document.getElementById（“状态栏”）.innerHTML=
'名称：
'+
'密码：
'+
“登录”；
文件
.querySelector（“#状态栏按钮”）
.addEventListener（'click'，emit\u login，false）；
}

---

更新：整个要点是不鼓励使用onclick属性，而且绝对不是javascript的好部分。

将其移出onload函数。您需要了解scope@Amit我的错，我没有看到从

draw\u login

生成的按钮调用

emit\u login

函数。请将其移到onload函数之外。您需要了解scope@Amit糟糕的是，我没有看到从

draw\u login

生成的按钮调用

emit\u login

函数。

function draw_login() {
    document.getElementById("status_bar").innerHTML = 
        'Name:<input type="text" id="login_name"></input><br>'+
        'Password:<input type="password" id="login_password"></input><br>'+
        '<button type="button">login</button>';

    document
        .querySelector('#status_bar button')
        .addEventListener('click', emit_login, false);
}