50

我只有 1 个输入字段，我想注册 onChange 和 onKeyPress 事件来检测用户何时完成输入或按下 Enter 键。我只需要使用javascript。谢谢您的帮助。

我有：

var load = function (){
   //I want to trigger this function when user hit Enter key.
}

document.getElementById('co').onchange=load;   //works great
document.getElementById('co').onKeyPress=load; 
//not sure how to detect when user press Enter

html

//no form just a single input field
<input type='text' id='co'>
4

8 回答 8

81 
document.getElementById('foo').onkeypress = function(e){
    if (!e) e = window.event;
    var keyCode = e.code || e.key;
    if (keyCode == 'Enter'){
      // Enter pressed
      return false;
    }
  }

演示

于 2012-07-06T15:55:59.303 回答
17

到目前为止，这些答案都没有具体回答这个问题。问题分为两部分。1. Enter 被按下。2. 用途集中在输入上。

jQuery

$('#input-id').on("keyup", function(e) {
    if (e.keyCode == 13) {
        console.log('Enter');
    }
});

香草 JavaScript

inputId = document.getElementById('input-id');
inputId.addEventListener('keyup', function onEvent(e) {
    if (e.keyCode === 13) {
        console.log('Enter')
    }
});

这种方式 ENTER 仅在用户按 enter FROM 该输入时才被检测到。

于 2016-09-26T02:47:32.747 回答
11

更新和更清洁：使用event.key而不是event.keyCode. 没有更多的任意数字代码！

const node = document.getElementById('co');
node.addEventListener('keydown', function onEvent(event) {
    if (event.key === "Enter") {
        return false;
    }
});

Mozilla 文档

支持的浏览器

于 2017-09-05T21:26:11.343 回答
7

使其跨浏览器：

document.getElementById('foo').onkeypress = function(e) {
    var event = e || window.event;
    var charCode = event.which || event.keyCode;

    if ( charCode == '13' ) {
      // Enter pressed
      return false;
    }
}

有关更多详细信息，请参阅此问题：javascript 事件 e.which？

于 2012-07-06T16:08:00.320 回答
1

使用 event.keyCode

var code = (e.keyCode ? e.keyCode : e.which);
 if(code == 13) { //Enter keycode
   //Do something
 }

此链接中已经有讨论 jQuery Event Keypress: Which key waspressed？

于 2012-07-06T15:59:38.390 回答
0

这是一个很好的链接，讨论了这个主题并提供了一个工作示例

function DetectEnterPressed(e) {
var characterCode
if(e && e.which){ // NN4 specific code
e = e
characterCode = e.which
}
else {
e = event
characterCode = e.keyCode // IE specific code
}
if (characterCode == 13) return true // Enter key is 13
else return false
}

http://hspinfo.wordpress.com/2008/09/01/using-javascript-detect-enter-key-pressed-event-in-a-textbox-and-perform-the-action/

于 2012-07-06T15:56:39.420 回答
0

我使用这段代码，它工作正常：

document.getElementById("theIdHere").onkeypressed = 
function() {
     if(this.event.which === 13)
        console('passed');
}
于 2016-01-28T18:39:53.637 回答
0

如今，您可以通过以下方式做到这一点：

document.getElementById('co').addEventListener('keydown',
  e => !e.repeat && e.keyCode === 13 && load());

请注意，load()它将运行一次。

于 2020-02-22T23:48:27.537 回答