捕获在Android虚拟键盘上使用JavaScript键入的键
我有一个带有textarea的网页，我需要捕获用户键入的键（以便我可以用键入的键replace不同的Unicode字符）。 我目前的代码如下：
$("#myTextArea").bind('keypress', function(event) { var keyInput = event.which; // call other functions }); 以上代码适用于PC和iPhone / Safari。 但是， 在Android （三星）平板电脑上使用Chrome时会失败 。 出于某种原因，当我在android虚拟（软）键盘上键入时，不会触发“按键”事件 。 Android版本是5.0.2。
如果我尝试使用“keyUp”或“keyDown”，那么对于所有的字符 （除了返回键，空格，退格键等） 总是返回229 。
即使keyCode始终为229，textarea也会显示用户input的正确字符。 这意味着设备知道哪个键被input，但不知何故，我无法得到处理这个事件（和关键代码）使用JavaScript。
以下是我迄今尝试过的替代scheme及其结果：
$("#mainTextArea").on("keydown keyup", function(event) { // event.which and event.keyCode both return 229 $(document).on('keypress', function(event) { // function is not triggered $('#myTextArea').bind('input keypress', function(event) { // comes inside function, but keyCode and which are undefined
任何有关这个问题的帮助表示赞赏..
不幸的是，你似乎在这里做不了多less事情。 按键事件被弃用，因此不被解雇。 keyup和keydown上的229表示键盘缓冲区正忙。 原因 – 当您按下某个键时，由于自动提示和其他可能立即出现的事件并使事件失效，input仍不能保证是用户按下的。 虽然在我看来，最好先发送钥匙，然后再发动另一个事件，也许是自动提示，所以你可以单独采取行动。
我现在唯一知道的是附加到keydown和keyup上，在keydown上存储值，在keyup上获取值，并finddelta值，这是用户按下的值。 不幸的是，这不适用于非input控件（例如 – 身体或类似的东西）。 也许不是你想听到的答案，但仍然。
我遇到了同样的问题。 有几个解释，但无论如何，似乎奇怪的是没有解决scheme提供。 目前我通过捕获oninput事件来解决这个问题。
“这个事件类似于onchange事件，不同之处在于oninput事件是在元素值改变后立即发生的，而onchange是在元素失去焦点时发生的，
此事件支持插入文本，从粘贴文本或更正和build议。
它不能给我提供完美的解决scheme，因为我只能在进入之后操作文本，但是现在这是最好的解决scheme。
如果有人有更好的解决scheme，我会很高兴听到。
只要检查你的input字符keyCode，如果它是0或229，那么这里是函数getKeyCode（） ，它使用JS的charCodeAt返回inputstring参数的KeyCode，并返回最后一个字符的键码。
<script> var getKeyCode = function (str) { return str.charCodeAt(str.length); } $('#myTextfield').on('keyup',function(e){ //for android chrome keycode fix if (navigator.userAgent.match(/Android/i)) { var inputValue = this.value; var charKeyCode = e.keyCode || e.which; if (charKeyCode == 0 || charKeyCode == 229) { charKeyCode = getKeyCode(inputValue); alert(charKeyCode+' key Pressed'); }else{ alert(charKeyCode+' key Pressed'); } } }); </script>
我在为我正在研究的一个项目进行研究的同时，也遇到了这个讨论。 我不得不为移动应用程序创buildinput掩码，而Pavel Donchev的回答让我想到了可以在Android中捕获键的工具。 在我的具体项目中，keydown和keyup是不够的，因为keyup事件只是在一个key被释放后触发的，所以这意味着在后期的validation中，所以我对input事件做了一些更多的研究（以及大量的试验和错误）并得到它的工作。
var input = document.getElementById('credit-card-mask'), oldValue, newValue, difference = function(value1, value2) { var output = []; for(i = 0; i < value2.length; i++) { if(value1[i] !== value2[i]) { output.push(value2[i]); } } return output.join(""); }, keyDownHandler = function(e) { oldValue = input.value; document.getElementById("onkeydown-result").innerHTML = input.value; }, inputHandler = function(e) { newValue = input.value; document.getElementById("oninput-result").innerHTML = input.value; document.getElementById("typedvalue-result").innerHTML = difference(oldValue, newValue); } ; input.addEventListener('keydown', keyDownHandler); input.addEventListener('input', inputHandler);
<input type="text" id="credit-card-mask" /> <div id="result"> <h4>on keydown value</h4> <div id="onkeydown-result"></div> <h4>on input value</h4> <div id="oninput-result"></div> <h4>typed value</h4> <div id="typedvalue-result"></div> </div>
有一个textInput事件给你input的字符
const inputField = document.getElementById('wanted-input-field'); inputField.addEventListener('textInput', function(e) { // e.data will be the 1:1 input you done const char = e.data; // In our example = "a" // If you want the keyCode.. const keyCode = char.charCodeAt(0); // a = 97 // Stop processing if "a" is pressed if (keyCode === 97) { e.preventDefault(); return false; } return true; });
我想到了！
这是一个百分之百的工作解决scheme，可以随时随地使用每个function，甚至包括iOS上的表情符号build议和任何粘贴的内容。 我使用子string比较来查找从onInput更改为onInput实际的东西。
指出哪些文本被删除，哪些文本被插入哪些点。
评分和select作为答案表示赞赏。
var x = document.getElementById("area"), text = x.value, event_count = 0 function find_Entered_And_Removed_Substrings( previous_string, current_string, pos ) { let right_pos = pos, right_boundary_of_removed = previous_string.length - ( current_string.length - pos ), left_max_pos = Math.min( pos, right_boundary_of_removed ), left_pos = left_max_pos for ( let x = 0; x < left_max_pos; x++ ) { if ( previous_string[x] !== current_string[x] ) { left_pos = x break } } return { left: left_pos, right: pos, removed_left: left_pos, removed_right: right_boundary_of_removed } } x.oninput = (e) => { // debugger; let cur_text = x.value, positions = find_Entered_And_Removed_Substrings( text, cur_text, Math.max( x.selectionStart, x.selectionEnd ) ) console.log(positions) let entered = cur_text.substring( positions.left, positions.right ), removed = text.substring( positions.removed_left, positions.removed_right ) if ( entered.length > 0 || removed.length > 0 ) { document.getElementById("entered") .innerHTML += entered document.getElementById("removed") .innerHTML += removed document.getElementById("events") .innerHTML = event_count++ } text = cur_text }
<textarea id="area"></textarea> <br/> <pre id="entered"></pre> <br/> <div id="events"></div> <pre id="removed"></pre>
