关于javascript：在输入键上执行函数


execute function on enter key


我有一个输入，我只想添加一个事件监听器来激活一个函数，当我按下回车键，输入被聚焦时。 我如何用纯JS做到这一点？


现在我有：


HTML：

1
2
        Enter your wage:<input type="text" id="wage" value ="" size=20>
        <button id="sub">Submit</button>


使用Javascript：

1
2
3
4
5
    var wage = document.getElementById("wage");
    wage.addEventListener("change", validate);

    var btn = document.getElementById("sub");
    btn.addEventListener("click", validate);


因此，当我单击或更改文本时，函数validate()基本上会激活，但我想通过按Enter来调用它。


你可以用这个：

1
2
3
4
5
6
7
8
9
10
11
var wage = document.getElementById("wage");
wage.addEventListener("keydown", function (e) {
    if (e.keyCode === 13) {  //checks whether the pressed key is"Enter"
        validate(e);
    }
});

function validate(e) {
    var text = e.target.value;
    //validation of the input...
}


现场演示

相关讨论

1
2
3
4
5
6
var elem = document.getElementById("wage");
elem.onkeyup = function(e){
    if(e.keyCode == 13){
       validate();
    }
}


工作实例http://jsfiddle.net/aMgLK/


以下是当前接受的答案(来自@MinkoGechev)的一个版本，其中包含key而不是keyCode：

1
2
3
4
5
6
7
8
9
10
11
const wage = document.getElementById('wage');
wage.addEventListener('keydown', (e) => {
    if (e.key === 'Enter') {
        validate(e);
    }
});

function validate(e) {
    const text = e.target.value;
    //validation of the input...
}
相关讨论


如果将按钮元素更改为a

1
<input type="submit" value="Submit">


它可以使用键盘上的enter按钮。

1
2
3
4
5
6
7
8
$(document).on("keyup", function(e) {
    var key = e.which;

    if (key == 13) // the enter key ascii code
    {
        login();
    }
});
相关讨论


或者使用jQuery

1
2
3
4
5
$("#wage").on("keydown", function (e) {
    if (e.keyCode === 13) {  //checks whether the pressed key is"Enter"
        validate(e);
    }
});


你需要类似的东西
wage.addEventListener('keydown', validate);


然后，您的验证功能需要检查event.keyCode == 13以确定"输入"按键。