javascript - 当我按回车键时,无法登录

标签 javascript html keystroke

我一直在尝试使用 Enter 键登录离线 HTML/CSS 页面,但无法使用我确定需要的 JavaScript 启动。

但是当我单击我创建的登录按钮时可以使用鼠标登录..

如何使用回车键登录?

这是我为凭证测试硬编码的 javascript,它使用鼠标单击来工作。我想要它作为回车键。谢谢。

<!DOCTYPE HTML>
<html>
<head>
<title>
Login page
</title>
</head>
<body>
<div align="center">
<div id="bor">

<h1>
   Login Page
</h1>

<div>
<form name="login">
&nbsp<input type="text" placeholder="Enter the Username" name="user"/> <br />
 <input type="password" placeholder="Enter the Password" name="pwd"/><br /><br />
 <input type="checkbox" name="en" value="en" />Remember Me<br>
<input type="button" onclick="check(this.form)" value="Login"/>
<input type="reset" value="Cancel"/>
</form>
</div>


<script language="javascript">
function check(form)
{
   if(form.user.value == "user" && form.pwd.value == "pwd")
   {
       window.open('inbox.html','_self')
   }
   else
   {
       alert("Error Password or Username")
   }
}
</script>

最佳答案

使用提交事件处理程序。仅当您单击元素时,元素上的单击处理程序才会触发。您想要做的是提交表单,但使用 javascript 而不是在服务器上处理表单。我建议动态绑定(bind)它,但由于您已经将所有 javascript 都内联在内,所以我也会给出一个内联示例。

您需要将提交事件处理程序附加到表单元素。如果您内联执行此操作,则这将与 onsubmit="..." 一起使用。返回是为了阻止/允许将表单提交到服务器。如果函数返回“true”,则表单将提交到服务器。如果函数返回“false”,则不会提交表单。您还需要将提交按钮的类型更改为submit。如果单击该按钮,这将告诉浏览器提交表单。或者,如果您在输入字段中按 Enter 键,浏览器也会将其视为提交表单。

<form name="login" onsubmit="return check(this)">
&nbsp<input type="text" placeholder="Enter the Username" name="user"/> <br />
  <input type="password" placeholder="Enter the Password" name="pwd"/><br/><br/>
  <input type="checkbox" name="en" value="en" />Remember Me<br>
  <input type="submit" value="Login"/>
  <input type="reset" value="Cancel"/>
</form>

其背后的 JavaScript 基本保持不变。您会注意到我们将 this 传递给了该函数。这会将元素本身(在本例中为表单元素)传递给函数。如前所述,您需要返回 false。我已将 form 更改为 frm,因为 form 在某些浏览器中是全局定义的变量。

function check(frm)
{
   if(frm.user.value == "user" && frm.pwd.value == "pwd")
   {
       window.open('inbox.html','_self')
   }
   else
   {
       alert("Error Password or Username")
   }

   return false;
}

jsfiddle 示例:http://jsfiddle.net/AS5t5/

关于javascript - 当我按回车键时,无法登录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19510405/

相关文章:

javascript - 返回无效 0;与返回;

html - 导航栏没有获取页面的所有宽度

javascript - 滚动后响应式粘性菜单不起作用

wpf - KeyGesture 不接受 Shift+字母数字组合键

javascript - 如何在移动设备中滚动时隐藏水平滚动条

javascript - 在 jQuery 中使用数组或对象?

JavaScript 下拉列表 : Select onClick

javascript - 触发点击,或模态

javascript - 检测按下了哪个键 - 这是一个好方法吗?

linux - Xdotool 在 Raspberry Pi 上失败