我如何使用回车键来提交用户名和密码

Question

我有一个工作正常的登录按钮，它可以让用户登录等。但我也想允许用户按回车键登录。我该怎么做 this.I 尝试使用 onkeypress 进行测试，但它没有像下面那样做任何事情

<form>
      <div class="form-group">
        <input type="text" class="form-control" placeholder="Username id="username" />
       </div>
      <div class="form-group">
      <input type="password" class="form-control" placeholder="........" id="password" onkeypress=myFunction() /> //i just tried this myFunction() to see if it would give an alert but it doesnt
      </div>
     <div class="form-group">
   <button type="submit" class="btn btn-primary btn-login" id="btnLogin">Log in</button>

  </div>
  </div>
  </form>

function myFunction()
 { alert("button pressed")}

那么我如何使用回车键在 javascript 和 jquery

中提交我的请求

Answer 1

当您将 input 放置在包含提交按钮的 form 元素中时，默认情况下会出现此行为。要挂钩它，请使用表单的 submit 事件，如下所示：

$('form').on('submit', function(e) {
  e.preventDefault(); // only used to stop the form submission in this example
  console.log('form submitted');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <div class="form-group">
    <input type="text" class="form-control" placeholder="Username" id=" username" />
  </div>
  <div class="form-group ">
    <input type="password" class="form-control" placeholder="........" id="password" />
  </div>
  <div class="form-group">
    <button type="submit" class="btn btn-primary btn-login" id="btnLogin">Log in</button>
  </div>
</form>

请注意，我修复了第一个 input 中 placeholder 属性后缺失的 "。您也不需要所有属性值后的尾随 space，所以我也删除了它们。

Answer 2

首先您需要将事件发送到 myFunction() 函数并将 ID 添加到您的表单以手动添加提交::

HTML

<form id='myForm'>
<!-- form actions (etc..) -->
<input type="password" class="form-control" placeholder="........" id="password" onkeypress=myFunction(e) />
<!-- form actions (etc..) -->
</form>

现在在 ASCII 中，重新输入代码是 13 所有你需要检查的是当按下的键重新输入时 (13) 然后你需要获取事件键代码并调用提交函数::

function myFunction(e)
var code = (e.keyCode ? e.keyCode : e.which);
{
   if (code == "13")
    {
        //Calling the submit or clicking manually it 
        $( "#myForm" ).submit();   
    }
}

我如何使用回车键来提交用户名和密码

how do i use an an enter key stroke to submit a username and password

html

javascript

jquery

onkeypress