检测在没有jQuery的html输入中输入keypress

我只想检测我的android设备上的输入输入按键。我发现，使用jQuery，我们可以做如下：检测在没有jQuery的html输入中输入keypress

$('#inputText').keypress(function(event) { 
var keycode = event.keyCode || event.which; 
if(keycode == '13') { 
    alert('You pressed a "enter" key in somewhere');  
} 
});

但我不想使用jquery。我想用传统的方式如使用

的document.getElementById（“inputText的”）

但我不知道如何在按键事件函数添加。你们有什么想法吗？

来源

2017-03-07 Coolguy

您可以使用addEventListener

的document.getElementById（ 'inputText的'）的addEventListener（ “按键” 功能（）{}）。

来源

2017-03-07 09:34:20

几乎与jQuery相同。使用eventListener并将参数e传递给捕获事件的函数，它的格式为keyCode。

var elem = document.getElementById('inputText'); 
 
elem.addEventListener('keypress', function(e){ 
 
    if (e.keyCode == 13) { 
 
    console.log('You pressed a "enter" key in somewhere'); 
 
    } 
 
});

<input id='inputText'>

来源

2017-03-07 09:34:50

大演示类用户！这可以在android中工作吗？ – Coolguy

@Coolguy我没有自己测试，但我想是这样。 –

@Arun D感谢您的编辑，但我更愿意避免使用DOM事件，“onkeypress”或“onclick”。（： –

你可以做到这一点..

document.getElementById("id_of_textbox") 
     .addEventListener("keyup", function(event) { 
     event.preventDefault(); 
     if (event.keyCode == 13) { 
      document.getElementById("id_of_button").click(); 
     }

另一种方法是使用onkeypress

<input type="text" id="txtSearch" onkeypress="return searchKeyPress(event);" /> 

<script> 
function searchKeyPress(e) 
{ 
    // look for window.event in case event isn't passed in 
    e = e || window.event; 
    if (e.keyCode == 13) 
    { 
     document.getElementById('btnSearch').click(); 
     return false; 
    } 
    return true; 
} 
</script>

来源

2017-03-07 09:36:21

您可以使用

document.getElementById('txtBox').onkeypress = function(e) { 
 
    if (!e) e = window.event; 
 
    var keyCode = e.keyCode || e.which; 
 
    if (keyCode == '13') { 
 
    alert("Enter Pressed"); 
 

 
    } 
 
}

<input id="txtBox" type="text" />

来源

2017-03-07 09:50:35

document.getElementById("id").onKeyDown = function(event) {if (event.keycode === 13) alert("return pressed";)};

来源

2017-03-07 16:16:37

or keypressed or keyup –

这样做：

<form onsubmit="Search();" action="javascript:void(0);"> 
<input type="text" id="searchCriteria" placeholder="Search Criteria"/> 
<input type="button" onclick="Search();" value="Search" id="searchBtn"/>

来源

2017-04-12 18:32:22 Mathew

你可以给答案增加一些解释吗？虽然只有代码的答案可以解决这个问题，但它通常不会教会任何操作，并且不会对未来的用户有用。 – Cullub

使用event.key，而不是event.keyCode！

const node = document.getElementById('inputText'); 
node.addEventListener('keydown', function onEvent(event) { 
    if (event.key === "Enter") { 
     // Do something 
    } 
});

Mozilla Docs

Supported Browsers

来源

2017-09-05 21:32:03 Gibolt

检测在没有jQuery的html输入中输入keypress

回答

相关问题