Question

我试图通过虚拟场景学习javascript，下面不会在实时上下文中使用。所有的html页面都在我的家庭服务器上，这就是为什么我没有在链接中使用http：// etc。

我试图将下面的代码带到＆＃34;索引＆＃34;如果我输入正确的用户名和密码并保留在＆＃34; home＆＃34;页面，如果我输入错误但有一个警告声明＆＃34;无效登录＆＃34;。如果我输入正确的用户名和密码，我正确地重定向但如果在正确触发警报后输入错误的用户名/密码，我也会重定向到索引页面

如何针对错误的用户名/密码停止索引页面加载？我确定它可能很简单，我很想念！

这是主页的HTML

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<div id="container">

<div id="loginbox">
<form id="login" action="home.html">
Username: <input type="text" name="user" id="user"><br>
Password: &nbsp;<input type="password" name="password" id="password"><br>
<input type="submit" value="Login" onclick="checkUserName()">
</form>

</div>
</div>

这是脚本

function checkUserName() {
var User = document.getElementById("user").value;
var Password = document.getElementById("password").value;

if (User === "user123" && Password === "password123") {
    window.location = "index.html";
}
else  {
    alert("Invalid Login");
}
}

干杯！

Answer 1

在这种情况下，您不想提交表单。您只需要在点击登录时调用js功能。因此，请使用普通按钮代替提交。

<button onclick="checkUserName()">login</button>

当您使用提交按钮时，表单将被提交，除非您没有阻止e.preventDefault()的默认操作或从被调用的js函数返回false

＆＃13;

function checkUserName() {
var User = document.getElementById("user").value;
var Password = document.getElementById("password").value;

if (User === "user123" && Password === "password123") {
    window.location = "index.html";
}
else  {
    alert("Invalid Login");
}
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<div id="container">

<div id="loginbox">
<form id="login" action="home.html">
Username: <input type="text" name="user" id="user"><br>
Password: &nbsp;<input type="password" name="password" id="password"><br>
<button onclick="checkUserName()">login</button>
</form>

</div>
</div>

＆＃13;

如果声明重新指示不按预期工作

1 个答案: