JavaScript在Android浏览器中没有触发keypress事件

Question

我已经创建了一个简单的代码来处理keypress事件：

var counter = 0;        
$('input').on('keypress', function () {
    $('div').text('key pressed ' + ++counter);
});

JSFiddle。

但是在移动浏览器（Android 4+，WindowsPhone 7.5+）上，keypress事件处理程序不会被触发。 可能是什么问题呢？

- alex.mironov

---

尝试使用@The System Restart在这里提供的建议：https://dev59.com/KWPVa4cB1Zd3GeqP9M5S - welbornio

Answer 1

我相信现在已经废弃了keypress。你可以在Dom Level 3规范中查看。使用keydown或keyup应该可以正常工作。该规范还建议您使用beforeinput而不是keypress，但我不确定这项功能的支持情况。

- Adam Hughes

---

keydown事件不会传递字符，而是键码。因此，keydown不能替代keypress。 - Meixner

@Meixner 这是很久以前的事情了，所以我不知道Keypress在Android上是否仍然不受支持。不过，这个解决方案的想法是你从按键码中找到字符。 - Adam Hughes

屏幕键盘仍不支持“keypress”事件。 - Meixner

keypress 在 iPhone 上仍然可用，但在 Android 上无法使用，而 keydown 对于 iPhone 和 Android 都不起作用。 - OM The Eternity

注意：beforeinput事件应该是可取消的，但在Chrome上却不行。https://stackoverflow.com/questions/53140803/why-is-contenteditable-beforeinput-event-not-cancelable - user3187724

Answer 2

使用 keyup 事件：

// JavaScript:
var counter = 0;        
document.querySelector('input').addEventListener('keyup', function () {
    document.querySelector('div').textContent = `key up ${++counter}`;
});

// jQuery:
var counter = 0;        
$('input').on('keyup', function () {
    $('div').text('key up ' + ++counter);
});

- HDT

---

如果你想要对变化做出反应，甚至更好地使用oninput。但是，如果你想要实际输入的按键，这些方法在Android上都不会有用。 - Íhor Mé

@ÍhorMé，你有关于Android键盘事件的解决方案吗？ - Mrunal

@Mrunal 通常情况下，您应该使用oninput事件。如果您需要处理所有（或至少许多）平台上的输入文本，我已经在此处https://dev59.com/fV0a5IYBdhLWcg3wD1Lb#42918806发布了代码。它使用4个空格缩进格式化，而Stack则使用8个空格缩进格式化，请注意。 - Íhor Mé

Answer 3

使用jQuery的输入事件，如下所示：

使用jQuery的输入事件，如下所示：

$( 'input' ).on( 'input', function() {
    ...
} );

使用这种方法无法使用 e.which 来确定按下了哪个键，但我在这里找到了一个不错的解决方法：http://jsfiddle.net/zminic/8Lmay/

- Torben

Answer 4

$(document).ready(function() {
  var pattForZip = /[0-9]/;
  $('#id').on('keypress input', function(event) {
    if(event.type == "keypress") {
      if(pattForZip.test(event.key)) {
        return true;
      }
      return false;
    }
    if(event.type == 'input') {
      var bufferValue = $(this).val().replace(/\D/g,'');
      $(this).val(bufferValue);
    }
  })
})

- Chakradhari Jamili

---

请尽量为您的解决方案添加更多信息。欢迎来到 Stack Overflow :) - kiecodes

Answer 5

是的，一些安卓浏览器不支持keypress事件，我们需要使用只有keydown或keyup但会得到不同的键码，为了避免不同的键码，请使用以下函数通过发送字符值来获取键码。

例如：

function getKeyCode(str) {
  return str && str.charCodeAt(0);    
}
function keyUp(){
 var keyCode = getKeyCode("1"); 
}

- Gsvp Nagaraju

Answer 6

我认为用其他事件代替“keypress”是个不好的主意。 你需要做的就是将一个jQuery文件包含到你的项目中。 任何版本的名为jQuery.mobile.js或类似的文件（例如jQuery.ui.js）都可以帮助你。

你可以从这里下载它：https://jquerymobile.com/download/

- Devang Kamdar