Question

我只有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'>

Answer 1

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

DEMO

Answer 2

使其跨浏览器：

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 event e.which?

Answer 3

这些答案都没有具体回答这个问题。问题分为两部分。 1.输入已按下。 2.用途主要集中在输入上。

<强> Jquery的

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

Vanilla JavaScript

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

这样只有当用户按下输入FROM输入时才会检测到。

Answer 4

更新，更清洁：使用event.key代替event.keyCode。 不再有任意数字代码！

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

Mozilla Docs

Supported Browsers

Answer 5

使用event.keyCode

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

此链接中已有讨论 jQuery Event Keypress: Which key was pressed?

Answer 6

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

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/

Answer 7

我使用此代码并且工作正常：

document.getElementById("theIdHere").onkeypressed = 
function() {
     if(this.event.which === 13)
        console('passed');
}

Answer 8

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

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

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

如何检测用户何时在输入字段中按Enter键

8 个答案: