我使用的是以下代码的变体。当我按下回车键时，它会刷新整个网页，而不是提交表单。我尝试过搜索，但我对编码一无所知，所以其他答案都对我没有帮助，因为它们不是我的代码特有的。提前谢谢，我真的很感激你的帮助！
<html>
<head>
<head>
<style>
.button {
background-color: blue; /* Green */
border: 1;
color: white;
padding: 8px 10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}
input {
width: 200px;
height: 30px;
background-color : #d1d1d1;
border-style:groove;
}
</style>
</head>
<body>
<form name="login" method=POST>
<center>
<strong>Password:<strong>
<input type="password" name="pswrd" onkeydown = "if (event.keyCode == 13)
document.getElementById('pwsubmit').click()" />
<button class="button" id="pwsubmit" type="button"
onclick="check(this.form)" value="Login"/>Submit</button></center>
</form>
<script language="javascript">
function checkentry(e)
{
document.getElementById("pswrd")
.addEventListener("keyup", function(event) {
event.preventDefault();
if (event.keyCode == 13) {
document.getElementById("id_of_button").click();
}
});
}
function check(form)
{
// The list below MUST contain all valid passwords
if (['laura', 'molly', 'katie', 'chris'].indexOf(form.pswrd.value) >= 0) {
// Go to different websites/weebly pages based on the entered password
switch(form.pswrd.value) {
case "laura":
window.open('http://www.bk.com','_self');
break;
case "molly":
window.open('http://www.mcdonalds.com','_self');
break;
case "katie":
window.open('https://www.supermacs.ie/','_self');
break;
case "chris":
window.open('https://www.kfc.ie/','_self');
break;
}
}
// Show following message if invalid password entered
else {alert("Invalid password entered!!!")}
}
</script>
</body>
HTML中表单的默认行为是回车键将调用输入元素后表单的第一个下一次提交按钮。
这里有一个例子：
<!DOCTYPE html>
<html>
<body>
<h2>HTML Forms</h2>
<form>
First name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<button type="submit" onclick="sayHello()">OK</button>
</form>
<script>
function sayHello(){
alert('Hello every body!');
}
</script>
</body>
</html>HTML表单有一个名为action的属性。该属性也具有默认行为。此行为如下(来自https://www.w3schools.com/html/html_forms.asp)：
action属性定义表单已提交。通常，表单数据会发送到服务器。如果操作属性，则操作设置为当前页面。
因此，当您在文本字段中点击回车键时，表单将被提交，并且当前页面将被重新加载。
为了防止这种行为，您可以使用peventDefault()函数来防止这种默认行为。
因此，您的示例代码的简化编辑版本可以如下所示：
<!DOCTYPE html>
<html>
<body>
<h2>HTML Forms</h2>
<form id="myForm" onsubmit="check(event)">
<strong>Password:<strong>
<input type="password" name="pswrd" />
<button class="button" id="pwsubmit" type="button" onclick="check(event)" value="Login">Submit</button>
</form>
<script>
function check(event)
{
event.preventDefault();
var form = document.getElementById('myForm');
if (['laura', 'molly', 'katie', 'chris'].indexOf(form.pswrd.value) >= 0) {
switch(form.pswrd.value) {
case "laura":
window.open('http://www.bk.com','_self');
break;
case "molly":
window.open('http://www.mcdonalds.com','_self');
break;
case "katie":
window.open('https://www.supermacs.ie/','_self');
break;
case "chris":
window.open('https://www.kfc.ie/','_self');
break;
}
} else {
alert("Invalid password entered!!!")
}
}
</script>
</body>
</html>请注意，您的代码也有一些语法错误。