原文: https://howtodoinjava.com/jquery/jquery-detect-if-enter-key-is-pressed/

学习在 jQuery 中检测ENTER键示例。 这是常识,如果您必须检测浏览器中按下的键,则必须检入键码(ascii)值。 简单容易。 当您不知道如何正确使用此功能时,就会出现问题。 例如,您是否需要绑定按键或按键? ENTER键的 ascii 值是多少?

1. jQuery 检测ENTER

注意,ENTER”键由 ASCII 代码“13” 表示。 检查此 ASCII 图表

要检查用户是否在网页或任何输入元素上按下ENTER键,可以将keypresskeydown事件绑定到该元素或文档对象本身。 然后在bind()函数中检查所按下键的键码是否为 13。

如果按键的 ASCII 码为 13,则按“ENTER”键; 否则,将按下其他键。

阅读更多:keypress事件和keydown事件之间的区别

2. jQuery 检测在文本框中按下的ENTER

  1. $('#someTextBox').keypress(function(event){
  2. var keycode = (event.keyCode ? event.keyCode : event.which);
  3. if(keycode == '13'){
  4. alert('You pressed a "enter" key in textbox');
  5. }
  6. });

3. jQuery 检测在文档对象上按下的ENTER

  1. $(document).keypress(function(event){
  2. var keycode = (event.keyCode ? event.keyCode : event.which);
  3. if(keycode == '13'){
  4. alert('You pressed a "enter" key in somewhere');
  5. }
  6. });

在 Firefox 中,您必须使用event.which来获取键码; IE 支持“event.keyCode”和“event.which”。

4. jQuery 检测ENTER键 – 尝试一下

  1. <html>
  2. <head>
  3. <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
  4. </head>
  5. <body>
  6. <h1>Detect ENTER key with jQuery</h1>
  7. <label>TextBox Area: </label>
  8. <input id="someTextBox" type="text" size="40" />
  9. <script type="text/javascript">
  10. //Bind keypress event to textbox
  11. $('#someTextBox').keypress(function(event){
  12. var keycode = (event.keyCode ? event.keyCode : event.which);
  13. if(keycode == '13'){
  14. alert('You pressed a "enter" key in textbox');
  15. }
  16. //Stop the event from propogation to other handlers
  17. //If this line will be removed, then keypress event handler attached
  18. //at document level will also be triggered
  19. event.stopPropagation();
  20. });
  21. //Bind keypress event to document
  22. $(document).keypress(function(event){
  23. var keycode = (event.keyCode ? event.keyCode : event.which);
  24. if(keycode == '13'){
  25. alert('You pressed a "enter" key in somewhere');
  26. }
  27. });
  28. </script>
  29. </body>
  30. </html>

学习愉快!