构建了一个登录表单脚本，但它'；它不能使用JavaScript

我正在尝试构建一个login.js脚本，用于侦听登录表单提交事件。当我试图运行我的代码时，它没有登录或工作正常

我正在使用JavaScript，它被要求使用。我用HTML构建了登录表单，并在JavaScript中使用了登录函数。可以,；不能是内联JavaScript，它必须是一个独立于HTML的脚本

var计数=2；
函数验证（）{
var un=document.login.username.value；
var pw=document.login.password.value；
var-valid=false；
var usernameArray=[”adrian@tissue.com",
"dduzen1@live.spcollege.edu",
"deannaduzen@gmail.com"
]
var passwordArray=[“welcome1”，“w3lc0m3”，“w3lc0m3”ch1c@g0"]
对于（var i=0；i=1）{
警报（“错误的用户名或密码”）
计数--；
}否则{
警报（“用户名或密码不正确，您现在被阻止”）；
document.login.username.value=“您现在被阻止”；
document.login.password.value=“您现在被阻止”；
document.login.username.disabled=true；
document.login.password.disabled=true；
返回false；
}
}

创造
是否已注册？

登录
是否未注册？

您没有正确验证返回语句，而且您的

onsubmit

属性也在register表单中

在窗体上使用name属性 这将帮助您使用JavaScript轻松识别表单和输入，否则您可能无法识别较大表单中的哪个输入

登录
是否未注册？

将此应用于登录表单后，您可以通过执行

document.login

来引用它

利用JavaScript中的本机HTML事件 检索用户名和密码的方式非常复杂，您可以在JavaScript中添加一个事件侦听器，并在其中处理所有内容：

const loginForm=document.login；
loginForm.addEventListener（“提交”，验证）；

每次提交表单时，将调用

validate

。此外，它还将事件作为参数发送，因此您可以在函数中按如下方式接收：

功能验证（事件）{
event.preventDefault（）；//停止表单重定向
让user=event.target.user.value，
通过=event.target.pass.value；
//代码的其余部分。。。
}

这更容易，因为我们向输入添加了名称属性，所以我们可以通过

user

和

pass

来识别它们

验证 注意：我不建议直接在浏览器中验证用户名：密码数据，因为这是一个很大的漏洞，必须在服务器端验证

通过在对象中绑定用户名及其密码，而不是创建两个数组，可以简化此验证：

const账户={
"adrian@tissue.com“：“欢迎光临”，
"dduzen1@live.spcollege.edu“：“w3lc0m3”，
"deannaduzen@gmail.com": "ch1c@g0"
};

然后，将输入值保存在

user

和

pass

变量中，您可以执行以下操作：

if（帐户[用户]==通过）{
//成功登录
console.log（'Correct.Logged-in！'）；
}否则{
//错误的登录凭据
企图--；
validateAttents（）；
}

为了避免代码太多，您应该创建另一个函数，它的唯一任务是验证是否应该阻止用户

结果 我应该提到，这只适用于验证用户表单，如果需要保存会话并让用户登录，则必须使用服务器端语言

我给您留下一个片段，其中所有这些更改都有效，请您自己查看：

const账户={
"adrian@tissue.com“：“欢迎光临”，
"dduzen1@live.spcollege.edu“：“w3lc0m3”，
"deannaduzen@gmail.com": "ch1c@g0"
};
const loginForm=document.login；
尝试次数=3次；
loginForm.addEventListener（“提交”，验证）；
函数验证（事件）{
event.preventDefault（）；
让user=event.target.user.value，
通过=event.target.pass.value；
如果（帐户[用户]==通过）{
//成功登录
console.log（'Correct.Logged-in！'）；
}否则{
console.log（'错误的用户名或密码'）；
企图--；
validateAttents（）
}
}
函数validateAttents（）{
如果（这是index.html上的代码，成功后重定向到index.html吗？没有状态或会话知道用户重定向后是否失败或成功，因为这段代码都是客户端代码，不安全，希望您知道成功登录后代码应该重定向到index.html。我缺少什么？这非常有用。When将信息放入我的代码中，它仍然不会显示他们是否登录。或者它也不会显示登录尝试是否失败。我能够看到他们成功登录的唯一方法是，当我悬停链接时，左下角的信息显示正确的登录。我能做些什么来更正此问题？我仍然错过了吗有什么问题吗？我输入了你的代码信息，正如你所显示的。如果你需要的是向用户显示一些东西，你可以重新放置每个
控制台。用
警报
记录
，这将是最快的方法。总是很乐意帮助。如果你认为我的答案符合你的需要，我建议将其标记为已接受，这样你的帖子就会标记为已解决问题如果你对这篇文章还有任何疑问，你当然可以问